CookBook

スクリプト開発で登録フォームを作成する

投稿日:2015-12-10 更新日:

このCookBookでは、スクリプト開発で登録フォームを作成する際に役立つ Tips を紹介します。

完成イメージ

<操作方法>


1. フォームに任意の内容を入力し「登録」ボタンをクリックしてください。
2. 入力形式が不適切な場合はエラーメッセージが表示されます。
3. データの送信に成功した場合は登録処理の結果が表示されます。

完成サンプル

以下のサンプルをダウンロードしてご活用ください。

e builder プロジェクト : im_cookbook_109004.zip
imm ファイル : im_cookbook_109004-1.0.0.imm

ローカル環境で表示させる場合は、以下のURLにアクセスしてください。
http://localhost:8080/imart/im_cookbook/109004/edit
なおベースURLである以下の部分は、環境に合わせて適宜変更してください。
http://localhost:8080/imart

レシピ

  1. 入力項目を作成する。
  2. 登録ボタンを作成する。
  3. form タグを記述する。
  4. Ajax でデータを送信する。

1. 入力項目を作成する。

プレゼンテーションページに入力項目を配置してください。
今回は、入力フォームを表示するために 入力フォーム用テーブル「table.imui-form」 を使用してください。
必須入力の項目には 必須入力記号「label.imui-required」 を使用して、必須入力であることが視覚的にわかるようにしましょう。

cb_109004_imui-form

2. 登録ボタンを作成する。

入力フォームの下に登録ボタンを配置してください。
ボタン配置エリア「.imui-operation-parts」 の中にボタンを配置すると、ボタンの表示位置が自動調整されます。

3. form タグを記述する。

「1. 入力項目を作成する。」で作成したテーブルを form タグで括ります。

action属性にデータ送信先のURLを指定してください。
以下のようにマッピングされていますので、action 属性に「/im_cookbook/109004/ajax」と指定することで「im_cookbook_109004/ajax/ajax.js」が呼び出されます。

4. Ajax でデータを送信する。

imuiAjaxSend を使用し、フォームに入力されている値を Ajax で送信してください。

Ajax通信後に画面遷移させる場合は imuiAjaxSubmit を使用してください。

-CookBook
-,

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

FormaDesignerのユーザプログラム入力チェックをロジックフローで作成する方法

このCookBookでは、FormaDesignerのユーザプログラム入力チェックをロジックフローで作成する方法をご紹介します。 サンプルでは、スプレッドシート・グリッドテーブル・明細テーブルを使用し …

結合処理で「多数決」承認機能を実現する

このCookBookでは、「多数決」承認機能を実現する方法について紹介しています。 完成イメージ 以下の完成サンプルをダウンロードしてご活用ください。 im_logicdesigner-data-14 …

IM-LogicDesignerを利用して、IM-Workflow完了案件の確認対象者を削除する

このCookBookでは、IM-LogicDesignerを利用して、IM-Workflow完了案件の確認対象者を削除する方法について紹介しています。 完了案件でも、確認対象者が確認することはできます …

no image

Resin の Docker を作成する。

この CookBook では、Resin の Docker の作成手順について紹介しています。 レシピ ベースイメージの作成 Resin の Docker イメージを作成します 実行します 1. ベー …

no image

No.7 Excel 出力 → 他システム(別サーバ)連携

この記事は、EWS 2017で行われたLogicDesignerの講演内容に関する記事です。 こちらの例では、ファイルサーバ等他のサーバと連携し、別サーバ上のファイルを更新できます。 ロジックフローの …

まだデータがありません。

RSSRSSRSSRSS