フォーム メニュー

フォーム構成画面について

フォーム構成画面では、フォーム管理画面で作成したフォームに対して項目(フォーム要素)を追加する「要素の追加」と設置した項目に対してさまざまな設定をおこなう「項目の設定」、また追加した項目を削除する「要素の削除」ができます。

このページでは以下について説明します。

 

フォーム構成の流れ

フォーム構成画面の表示

フォーム要素を追加したいフォームの [ フォーム>設定 ] を選択します。

 

フォーム構成画面が表示されます。

 

フォーム要素の追加

「基本フォーム」か「設定済みフォーム」を1つずつ追加していきます。
追加するには、追加したいフォームのラジオボタンをクリックして下さい。

選択した項目が、画面下側の表の指定した位置に追加されます。

 

フォーム要素の設定

編集したい項目の設定(例:「一行入力」)をクリックします。

 

フォーム設定画面が表示されます。ここで各項目の設定が可能です。

変更が完了したら「保存する」をクリックして保存してください。

 

 

フォーム要素の追加方法 

「基本フォーム」か「設定済みフォーム」を1つずつ追加していきます。
追加するには、追加したいフォームのラジオボタンをクリックして下さい。
グループ化されているフォーム要素は、追加後に部分的に削除して使う事も出来ます。

※フォームのラジオボタンをクリックするとすぐに項目が追加されます。名称や行数を設定して項目を追加したい場合はクリック前に入力・選択してください。

選択した項目が、画面下側の表の指定した位置に追加されます。

基本フォーム

フォームの形式のみを選択してフォームを作成する時に選択します。

一行入力

名前など、一行で文章を入力できるフォームです。

複数行入力

複数行に亘る文章を入力できるフォームです。

セレクトボックス

単数選択用の選択フォームです。選択肢が多い場合に利用します。

ラジオボタン

単数選択用の選択フォームです。

チェックボックス

複数選択用のフォームです。

マルチボックス

複数選択用のセレクトボックスです。
選択にはキーボード操作が必要な為、できるだけチェックボックスを利用しましょう。

ファイル選択

ファイルアップロード用のフォームです。
ファイルは一旦「esform/app/tmp」ディレクトリに保存され、管理者宛メールに添付されます。

隠しフィールド

隠しフィールドは特別なフォームで、ユーザの入力操作とは無関係な商品情報などを埋め込む為に使います。埋め込まれた情報はユーザには表示されず、管理者だけが(メールと送信ログで)確認出来ます。

 

設定済みフォーム

よく使用されるフォームをカスタマイズしたものです。選択すると簡単に項目を作成出来ます。
必要に応じてご利用下さい。

単体項目

一行入力(名前、 名前+フリガナ(2)、メルアド、ホームページURL、電話番号、携帯番号、郵便番号、住所、簡易認証コード)、複数行入力(問い合わせ内容)、セレクトボックス(年齢、国籍、件名、地域別件名、地域、西暦、曜日)、ラジオボタン(性別、支払方法、評価)、チェックボックス(どこでお知りに?)

グループ項目

一行入力(姓名+フリガナ(4)、メルアド+再入力(2)、郵便番号(2))、セレクトボックス(期日(5)、期間(6)、職業、職種別職業、学歴、配達時間)、複合型(住所(5)、生年月日(4)、学歴(4)、銀行口座(5)、クレジットカード(5)、質問+その他入力(2)、規約+同意チェック(2))

名称

基本フォームを作成する場合に設定します。ここに入力した値がフォーム構成画面の「フォーム名」となります。
設定済みフォームの場合は入力しても反映されません。(事前に値が設定されているため)

行数

項目を追加する位置を設定します。
追加すると、元々設定した位置にある項目およびそれ以降の項目が一つずつ繰り下がります。
※グループ化された項目の位置を指定するとグループがその位置で解除されます。

作成されたフォーム要素

項目の表示される行です。

ID

項目固有のIDです。

グループ

グループ化されている項目の場合、グループ名が表示されます。
・▲:グループ単位で1つ上に移動します。
1つ上がグループの場合、そのグループの全項目の上に移動します。
・▼:グループ単位で1つ下に移動します。
1つ下がグループの場合、そのグループの全項目の下に移動します。
・×:グループ単位で削除します。
※クリックするとすぐに項目が削除されますのでご注意下さい。

フォーム名

各項目の名前です。

形式

入力値の形式です。片仮名、正整数、メールアドレス等があります。

イメージ

画面上での表示イメージです。

設定

フォーム形式です。クリックするとフォーム設定画面が表示されます。

配置

・▲:項目単位で1つ上に移動します。1つ上がグループの場合もそのまま1つ上に移動します。
・▼:項目単位で1つ下に移動します。1つ下がグループの場合もそのまま1つ下に移動します。

削除

・×:項目単位で削除します。
※クリックするとすぐに項目が削除されますのでご注意下さい。

 

 

フォーム要素の設定方法

設置した項目(フォーム要素)に対して、さまざまな設定をおこなうことができます。

表示方法

編集したい項目の設定(例:「一行入力」)をクリックします。

フォーム設定画面が表示されます。

 

項目概要

名称

項目名です。

識別ID

識別IDは各フォーム要素に付けられた固有の名前になります。HTMLドキュメント内ではIDの重複が認められていません。また、iQ CMSフォームはこのIDをエラー処理やメール文面でも使用する為、安易な単語に変更するとプログラムの予約語とバッティングする可能性があります。
※予約語とは予め使い方が決まっており変数名や関数名として定義できない単語のことです。どの単語が予約語にあたるかは言語ごとに異なります。(例:return、if、whileなど)

このフォーム以降がグループ化された場合に使うグループ名

複数項目でグループ化してこの項目が一番上にある場合、ここの値がそのグループ名となります。
※ここに値が入力されていると、グループ化しない場合もこの値が項目名となります(「名称」より優先されます)のでご注意ください。


上段のフォームとグループ化

上段のフォームとグループ化させたい場合に選択します。

・しない:グループ化しません。



・右に連結:グループ化します。(上段のフォームの右側に連結します)



・下に連結:グループ化します。(上段のフォームの下側に連結します)


※項目1のこのフォーム以降がグループ化された場合に使うグループ名に「設問1」と設定しています
※項目1と項目2のウォーターマークにそれぞれ「こちらが項目1」「こちらが項目2」と設定しています 

 

必須にする

必須回答項目にする場合は「はい」を選択します。
必須項目は、フォーム名にが表示されます。(例:「お名前」)

文字数制限 [一行入力、複数行入力、隠しフィールド]

入力可能な文字数を設定します。

選択数制限 [チェックボックス、マルチボックス]

選択可能な箇所数を設定します。

ファイル最大容量(キロバイト) [ファイル選択]

ファイル選択に表示されます。添付可能なファイルの最大容量を設定します。

文字変換フィルタ [一行入力、複数行入力、隠しフィールド]

入力された内容の全角半角、片仮名平仮名を自動的に変換したい場合に設定します。

形式チェック[一行入力、隠しフィールド]

入力フォームの入力形式を設定できます。必要に応じて設定します。
メールアドレスには2種類あり、控えメールを送信したい場合には「メールアドレス (このアドレスに控えメールを送信します。)」を設定して下さい。設定の仕方はこちらをご覧下さい。

 

独自チェック正規表現[一行入力、複数行入力、隠しフィールド]

preg_match関数」に与えるデリミタ付き正規表現を指定して独自の入力チェックを行えます。
※正規表現をご理解の方のみお使い下さい。

独自チェック用エラー文[一行入力、複数行入力、隠しフィールド]

独自チェックがエラーになった際のエラーメッセージを設定します。

選択項目 [セレクトボックス、チェックボックス、マルチボックス]

選択肢を設定します。

初期値
[一行入力、複数行入力、セレクトボックス、ラジオボタン、チェックボックス、マルチボックス、隠しフィールド]

アクセスした時の初期値を設定できます。
「return ~;」の形でPHPコードを指定した場合にはプログラムとして処理され、その戻り値が初期値になります。日付など初期値を自動的に変化させたい時に利用します。
チェックボックスとマルチボックスは、カンマ区切りをすることで複数の初期値を設定出来ます。

初期値をURLパラメータから得る
[一行入力、複数行入力、セレクトボックス、ラジオボタン、チェックボックス、マルチボックス、隠しフィールド]

URLパラメータとはURLの末尾に付ける?以降の文字のことです。
リンクにパラメータを付加する事で、フォームの件名や商品名を指定しておけます。
例)識別IDが「abcd」のフォーム要素の初期値に「東京支社」を設定したい場合
   https://ssl.iqcms.net/formdemo/form1.php?abcd=東京支社

設定と動作確認は以下の手順で実施できます。
 

  1. 初期値をURLパラメータから得る で 「はい」を選択します。
  2. 「保存する」をクリックして保存すると右側に入力欄が表示されます。
     
  3. フォーム構築画面にてフォームを構築します。
  4. 2.で表示された入力欄に値を入力して「←の値でテストする」をクリックします。
  5. 入力した値をURLパラメータに設定した状態でフォーム画面が表示されます。

    ※手順4.にて「ここに値を入力します」を入力した場合

クッキーに記録する
  [一行入力、複数行入力、セレクトボックス、ラジオボタン、チェックボックス、マルチボックス、隠しフィールド]

クッキーは次回の入力を補助する機能です。
注文フォームなどリピーターが多いフォームでは入力内容をクッキーに記録出来ます。
※「初期値」「初期値をURLパラメータから得る」「クッキーに記録する」を全て有効にした場合は、この順番で値のチェックが行われ、最後に代入された値が初期値となります。

横幅 [一行入力、複数行入力、ファイル選択]

その項目の横幅を設定します。

縦幅 [セレクトボックス、複数行入力、マルチボックス]

その項目の縦幅を設定します。

左側の名称や単位
[一行入力、複数行入力、ラジオボタン、セレクトボックス、チェックボックス、マルチボックス、ファイル選択]

項目の左側に単位や説明などのテキストを表示できます。確認画面とメールにも表示されます。


右側の名称や単位
[一行入力、複数行入力、ラジオボタン、セレクトボックス、チェックボックス、マルチボックス、ファイル選択]

項目の右側に単位や説明などのテキストを表示できます。確認画面とメールにも表示されます。


上部の記入例や注意点
[一行入力、複数行入力、ラジオボタン、セレクトボックス、チェックボックス、マルチボックス、ファイル選択]

項目の上側に単位や説明などのテキストを表示できます。


下部の記入例や注意点
[一行入力、複数行入力、ラジオボタン、セレクトボックス、チェックボックス、マルチボックス、ファイル選択]

項目の下側に単位や説明などのテキストを表示できます。


ウォーターマーク [一行入力、複数行入力]

ウォーターマークは「空のテキストフォーム」に表示させておく透かし文字です。
JavaScriptが有効なパソコン用フォームで表示させられます。


入力チェックだけに利用する
 [一行入力、複数行入力、ラジオボタン、セレクトボックス、チェックボックス、マルチボックス、ファイル選択]

タイプミスを防ぐ再入力フォームや、規約同意を促すチェックボックスなど、入力時の確認だけに使うフォームを作成出来ます。設定されたフォームは、確認画面以降は一切表示されなくなります。

 

 

フォーム要素の削除

誤って作成したフォーム要素や不要になったフォーム要素は削除することができます。

項目単位でフォーム要素を削除したい場合

各フォーム要素の右側(「削除」)の「×」をクリックするとその項目が削除できます。
例)5行目(「都道府県」)の「削除」の「×」をクリックすると「都道府県」項目が削除されます
※クリックするとすぐに項目が削除されますのでご注意下さい。

 

グループ単位でフォーム要素を削除したい場合

各フォーム要素の左から3番目(「グループ」)の「×」をクリックするとそのグループに属する項目をまとめて削除できます。グループに属さない項目の場合はその項目のみ削除されます。(項目単位でのフォーム要素削除と同じになります)
例)5行目(「都道府県」)の「グループ」の「×」をクリックすると「左番号」グループ(3,4,5,6,7行)がまとめて削除されます。
※クリックするとすぐに項目(グループ)が削除されますのでご注意下さい。

お問合せ

iQ CMSサポートの電話番号

iQ CMSサポートの無料資料請求

iQ CMSサポートのお問い合わせ