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

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

関連記事

no image

スクリプト開発した画面にバリデーション(入力チェック)を実装する

このCookBookでは、作成した画面項目に対してバリデーション(入力チェック)を設定する方法をご紹介します。 今回はスクリプト開発で登録フォームを作成するで作成した画面項目に対して、クライアントサイ …

no image

EWS2017 「業務への適用イメージがすぐに湧く!  魔法の業務ロジック作成ツール『IM-LogicDesigner』実用例 10本勝負!」講演内容のご紹介

この記事では、EWS2017 Technology Track「業務への適用イメージがすぐに湧く!  魔法の業務ロジック作成ツール『IM-LogicDesigner』実用例 10本勝負!」での講演内容 …

「イベント」ボタン・「一覧へ戻る」ボタンを使用し任意の遷移先を設定する

このCookBookでは、IM-FormaDesignerの画面アイテム・ボタンを使用し、任意の画面に遷移する方法について紹介しています。 設定方法は下記の2パターンです。 「イベント」ボタンを使用す …

no image

Forma標準アプリとIM-LogicDesignerを利用してBISワークフローを一括申請する方法

このCookBookでは、Forma標準アプリとLogicDesignerを利用して、BISワークフローを一括申請する方法を説明します。 完成イメージ ① グリッドテーブルの各行を、それぞれ案件として …

no image

IM-BISで作成したコンテンツ画面の内容をIM-PDF DesignerでPDFとして出力する方法

このCookBookでは、IM-BISで作成したコンテンツ画面の内容をIM-PDF DesignerでPDFとして出力する方法を紹介しています。 単票および表形式の帳票出力を行います。 完成イメージ …

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

RSSRSSRSSRSS