スポンサーリンク

UiPath カスタム入力の使い方

UiPath カスタム入力について

UiPathでユーザーにIDやパスワードなどを入力させてから処理を開始したいときに、入力ダイアログ1つずつしか入力が出来ないため、複数項目がある際に入力が少しめんどうになる。

しかし、カスタム入力だとHTMLファイルを表示し、入力フォームの項目などを自分で設定出来るため一括で入力できるようになり結構便利になる。

(不特定多数の人が利用するもので、毎回読み込むファイルを書き換えるのがめんどくさいときに凄い便利だったから自分用のメモとして。)

スポンサーリンク

UiPathカスタム入力作成方法

カスタム入力用HTMLファイルの作成

<!DOCTYPE html>
<html lang="ja">

<head>
   
  <meta charset="utf-8">
   
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
   <title>UiPath CustomForm</title>
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
</head>

<body>
   <div class="form-wrapper w-50" style="margin-left: auto; margin-right: auto; margin-top: 5%;">
         <div class="form-group">
             <label for="exampleInputName">氏名</label>
             <input type="text" class="form-control" id="Name">
           </div>
         <div class="form-group">
             <label for="exampleInputID">ID</label>
             <input type="text" class="form-control" id="Id">
           </div>
         <div class="form-group">
             <label for="exampleInputPassword">Password</label>
             <input type="password" class="form-control" id="Password">
           </div>
         <button type="submit" class="btn btn-primary" onclick="SubmitValues()">OK</button>
  </div>

   <script type="text/javascript">
    function SubmitValues() {
      var Name = document.getElementById("Name").value;
      var Id = document.getElementById("Id").value;
      var Password = document.getElementById("Password").value;
      window.external.setResult(Name + "," + Id + "," + Password);
      return true;
    }
  </script>

</body>
</html>

上記の内容でCustomForm.htmlファイルを作成する。
CSSはBootstrapを使っています。(見ればわかるかもしれないですが一応。。。)
https://docs.uipath.com/activities/lang-ja/docs/custom-input
こちらを参考に作っています。

UiPathでカスタム入力アクティビティを配置する

UiPathのアクティビティ内の システム -> ダイアログ -> カスタム入力を利用します。
アクティビティ検索(Ctrl + Alt + F)でカスタム入力で検索するとすぐに出てきます。

activity.png

URI(URLの間違いじゃないのかな・・・)に先ほど作成したCustomForm.htmlを指定します。
右側の...をクリックするとファイル選択画面が出てきます。
結果にはString型の変数を指定します。画像ではinput_dataとしてまいす。

Main.jpg

上記の画像のように代入繰り返し(コレクションの各要素)1行を書き込みアクティビティを配置します。
変数のinput_arrayはString配列です。

' 代入アクティビティ
input_array = Split(input_data, ",")
' もしくは
input_array = input_data.Split(","c)

実行する

kekka.png

セキュリティソフトやIEの設定で画像上側のポップアップが出るかもしれませんが、クリックして許可をすれば動きます。(ポップアップが出ない何か対策法があればどなたか教えてくれるとありがたいです。)

kekka2.png
  • 氏名:user
  • id:id
  • Password:pass

と入力してOKを押します。(OKボタンがなんかショボい)

出力結果

output.png

input_dataには入力した内容が","(コンマ)区切りで出力されます。
そのため、代入でString配列にし、 繰り返し(コレクションの各要素)で値を全て出力するようにします。
もう少しフォームはきれいに表示したいと思います。

コメント