Help us understand the problem. What is going on with this article?

UiPath Developer Community 第7回ワークショップ 覚え書き「カスタム入力アクティビティ」

More than 1 year has passed since last update.

UiPath Developer Community 第7回ワークショップ で聞いてきた内容の覚え書き。。

行ってきましたワークショップ第7回。今回は着席方式でした。
お弁当はおいしくいただけたのですが、着席方式のため、ビールが取りづらかったorz。。

さて今回のワークショップも、2018.3の新機能の説明が中心。
nupkgの依存性の仕様変更1も興味深かったですが、Custom Input Activity ってのがありましたのでご紹介。
image.png

このように、HTMLで作られた入力フォームを表示して、Submitした結果を得られるアクティビティです。今までは Input Dialog で一項目づつ入力してもらっていたと思いますが、いちどに複数項目を入力可能にできそうです。

やってみる

Custom Inputのアクティビティでは、先の図のようにインプットになるHTMLファイル名と結果を格納する変数を定義しておきます。

実際のHTMLファイルは、たとえば下記の通り(上記のリンク先のサンプルほぼそのままです)

input.html
<!DOCTYPE html>
<html lang="en">
 <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <title>UiPath KYC Solution</title>
  </head>
  <body>
          First Name:<br>
          <input type="text" id="First_Name"><br>
          Last Name:<br>
          <input type="text" id="Last_Name"><br>
          Age:<br>
          <input type="text" id="Age"><br>
          <button onclick="SubmitValues()">Submit</button>

          <script type="text/javascript">
          function SubmitValues(){
            var First_Name = document.getElementById("First_Name").value;
            var Last_Name = document.getElementById("Last_Name").value;
            var Age = document.getElementById("Age").value;
            window.external.setResult(First_Name + "," + Last_Name + "," + Age);
            return true;
          }
          </script>
  </body>
  </html>

なんともなつかしいJavaScript素のプリミティブなコードです。

window.external.setResult(First_Name + "," + Last_Name + "," + Age);

ココで、呼びだし元(Custom Input Activity) 側で用意したResultプロパティに値がセットされます。複数項目をどうやって一つの変数に取り込むのかな?と思ってましたが、このサンプルではカンマで繋いで一個にしています、、なるほどプリミティブだ、、。

実行すると、HTMLが表示されます。なんだか間延びしたダイアログなのはともかくとして、、
image.png

値を入力してSubmitすると、
image.png

実行結果が得られました。

JSONで取り出す

値がカンマ区切りってのはなんとも微妙ですよね。またワークショップでは、setResultするオブジェクトをJSON形式にしてセットしてました。そのときのコードは忘れましたが、簡単にかくとこんな感じ。

input.html
<!DOCTYPE html>
<html lang="en">
 <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <title>UiPath KYC Solution</title>
  </head>
  <body>
          First Name:<br>
          <input type="text" id="First_Name"><br>
          Last Name:<br>
          <input type="text" id="Last_Name"><br>
          Age:<br>
          <input type="text" id="Age"><br>
          <button onclick="SubmitValues()">Submit</button>

          <script type="text/javascript">
          function SubmitValues(){
            var First_Name = document.getElementById("First_Name").value;
            var Last_Name = document.getElementById("Last_Name").value;
            var Age = document.getElementById("Age").value;

            var jsonStr = {
              First_Name : First_Name,
              Last_Name: Last_Name,
              Age : Last_Name
            }
            window.external.setResult(JSON.stringify(jsonStr));
            return true;
          }
          </script>
  </body>
  </html>

ワークフロー側も、JSON文字列をJObjectオブジェクトにしています。
image.png

やってみます。表示されたダイアログに値を入れてSubmitすると、、
image.png

JSONで処理できましたねー。これで、HTMLを駆使すれば便利な入力画面がつくれそうです。

さいごに

ワークショップでは、かなりイイお弁当が。。ごちそうさまでした。

image.png

おつかれさまでした。。

関連リンク


  1. いままでは「Robotが動作環境に存在するアクティビティのうち最新バージョンを使用してしまう」仕様だったのが、2018.3のロボから指定ができるようになった件。固定的にバージョン指定(Strict)か、指定したバージョン以上で一番近い(低い)バージョンを使うか(Lowest Applicable Version)、指定出来るようになった。 

masatomix
JavaEEの開発やリッチクライアント開発のアーキテクトが専門でしたが、最近はRPAとAIがメイン。。。RPAはUiPathとOrchestratorの構築が中心です。 FirebaseとかOAuth/OIDCなど新しいモノ、あと数学もすき。 最近は Uipath Friends っていうユーザコミュニティにも関わってます。 あ、UiPath Japan MVP 2019 す。
primebrains
プライム・ブレインズは、マネジメントスキルだけでなく、最新のITスキルを兼ね備えた技術者がお客様の立場でお客様と共に、成功に向けてプロジェクトを推進します。
http://www.primebrains.co.jp/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした