CFFORMGROUP  
説明

複数のフォームコントロール用のコンテナコントロールを作成します。Macromedia Flash フォームおよび XML フォームの cfform タグ本文で使用します。HTML フォームでは無視されます。

 
カテゴリ

フォームタグ

 
シンタックス
<cfformgroup
   type = "group type"
   label = "label"
   style = "style specification"
   selectedIndex = "page number">
   width = "pixels"
   height = "pixels"
   enabled = "Yes"、"No"
   visible = "Yes"、"No"
   OnChange = "ActionScript expression"
   toolTip = "Tip text"
...ColdFusion フォームコントロール
</cfformgroup>
または
<cfformgroup
   type = "repeater"
   query = "query object"
startrow = "row number"
maxrows = "integer">
...ColdFusion フォームコントロール
</cfformgroup>
 
関連項目

cfapplet、cfcalendar、cfform、cfformitem、cfgrid、cfinput、cfselect、cfslider、cftextarea、cftree、『ColdFusion MX 開発ガイド』の第29章の「Macromedia Flash 形式のフォームの作成」 の「cfformgroup タグによるフォームの構築」および第30章の「スキン可能 XML フォームの作成」 の「cfformgroup タグの使用」

 
ヒストリ

ColdFusion MX 7: このタグが追加されました。

次の表に、Flash フォームの属性とその動作を示します。XML の場合、特記なき限り、属性は XML に渡されますが、ColdFusion MX に同梱されている基本的な XSL スタイルシートでは解釈されません。

メモ: XML でサポートされることが明記されていない属性は、ColdFusion MX で提供されるスキンでは処理されません。ただし、これらの属性は、生成された XML には含まれます。

 
使用方法

このタグには終了タグが必要です。cfform タイプが HTML の場合、このタグは無視されます。すべてのタグ本文の内容は、cfformgroup で囲まれていないかのように解釈されます。

Flash 形式のフォームでは、このタグがフォームの内容を構成します。このタグが子タグをグループ化して整列します。このタグの本文には、次のタグを含めることができます。その他のタグとテキストはすべて無視されます。

  • cfformgroup
  • cfformitem
  • cfcalendar
  • cfgrid
  • cfinput
  • cfselect
  • cftextarea
  • cftree

Flash フォームでのこのタグの使用方法については、『ColdFusion MX 開発ガイド』の第29章の「Macromedia Flash 形式のフォームの作成」 を参照してください。

XML 形式では、ColdFusion はこのタグとその属性を XML に渡します。XML を処理するのは、スキン XSLT です。ColdFusion の基本的なスキンは、horizontal、vertical、および dualselectlist のスタイルのみをサポートします。XML フォームでのこのタグの使用方法については、『ColdFusion MX 開発ガイド』の第29章の「Macromedia Flash 形式のフォームの作成」 を参照してください。

 

単一の cfformgroup タグを使用する XML フォームの簡単な例については、cfform を参照してください。

次の例は、cfformgroup タグを使用して Flash フォームに要素を整列する方法を示しています。hdividedbox コンテナを作成します。各 hdividedbox コンテナには、vbox コンテナが 1 つ含まれています。左のボックスには、見出しテキストと 2 つのラジオボタンがあります。右のボックスには、見出しテキストと 3 つのチェックボックスがあります。

<h3>簡単な cfformgroup の例</h3>
<cfform name="myform" height="450" width="500" format="Flash" >
   <cfformgroup type="hdividedbox" >
      <cfformgroup type="VBox">
         <cfformitem type="text" height="20">
            ペット :
         </cfformitem>
         <cfinput type="Radio" name="pets" label="Dogs" value="Dogs"
            checked>
         <cfinput type="Radio" name="pets" label="Cats" value="Cats">
      </cfformgroup>

      <cfformgroup type="VBox">
         <cfformitem type="text" height="20">
            果物 :
         </cfformitem>
         <cfinput type = "Checkbox" name="chk1" Label="Apples"
            value="Apples">
         <cfinput type="Checkbox" name="chk2" Label="Bananas"
            value="Bananas">
         <cfinput type="Checkbox" name="chk3" Label="Pears"
            value="Pears">
      </cfformgroup>
   </cfformgroup>
</cfform>

さらに複雑な次の例は、cfformgroup タグを使用して Flash フォームにコントロールを整列する方法をより詳細に示しています。cfformgroup の本文で使用できるテキストの書式設定機能も多数示しています。フォームを送信する際には、送信データを示すために、ページでは Forms スコープの内容をダンプします。

<h2>QueryNew の例</h2>
<cfif IsDefined("form.oncethrough")>
   <h3>次の情報を ColdFusion MX に送信したフォーム :</h3>
   <cfdump var="#form#"><br><br><br>
</cfif>

<h3>cfformgroup タグを使用する Flash フォーム</h3>
<cfform name="myform" height="450" width="500" format="Flash">

<!--- 次のフォームグループは書式設定されたテキストを表示する方法を示します。 --->
   <cfformitem type="html">
      <b><font color="#FF0000" size="+4" face="serif">
      このフォームには、次の事項を確認する 2 つのタブがあります。</font></b><br>
      <li>連絡先情報</li>
      <li><i>嗜好</i></li>
      <b>両方のタブに情報を入力してください。</b><br>
      フォームを送信して、ColdFusion の Forms スコープの内容を確認してください。</b><br>
      <a href="http://www.macromedia.com/" target="_blank">
      <font color="#0000FF"><u>
      このリンクにより、Macromedia のホームページが新しいブラウザウィンドウに表示されます。
      </u></font></a><br>
      &nbsp;<br>
   </cfformitem>

<!--- 2 つのタブがある tabnavigator を使用して、ユーザー入力を行います。 --->
   <cfformgroup type="tabnavigator" height="220">
      <cfformgroup type="page" label="Contact Information">
         <!--- 姓フィールドと名フィールドを水平方向に配置します。 --->
         <cfformgroup type="horizontal" label="Your Name">
            <cfinput type="text" required="Yes" name="firstName" label="First"
               value="" width="100"/>
            <cfinput type="text" required="Yes" name="lastName" label="Last"
               value="" width="100"/>
         </cfformgroup>
         <cfformitem type="html"><textformat indent="95"><font size="-2">
            電子メールフィールドは自動的に入力されます。 
            任意のテキストで置き換えることができます。
            </font></textformat>
         </cfformitem>
         <!--- bind 属性により、firstName および lastName フィールドに
               入力されたとおりのフィールドのコンテンツを取得します。 --->
         <cfinput type="text" name="email" label="email"
            bind="{firstName.text}.{lastName.text}@mm.com">
      
         <cfinput type="text" name="phone" validate="telephone" required="Yes"
            label="Phone Number">
      </cfformgroup>

      <cfformgroup type="page" label="Preferences">
         <cfformitem type="text" height="30">
            <b>あなたの好みをお聞かせください。</b>
         </cfformitem>
         <!--- ペット選択肢を果物選択肢の左に配置します。 --->
         <cfformgroup type="hbox">
         <!--- ペット選択肢ボックスのコンテンツをグループ化し、垂直方向に整列します。 --->
            <cfformgroup type="vbox">
               <cfformitem type="text" height="20">
                  ペット :
               </cfformitem>
               <cfformgroup type="vertical">
                  <cfinput type="Radio" name="pets" label="Dogs" value="Dogs"
                     checked>
                  <cfinput type="Radio" name="pets" label="Cats" value="Cats">
               </cfformgroup>
            </cfformgroup>
         <!--- 果物選択肢ボックスのコンテンツをグループ化し、垂直方向に整列します。 --->
            <cfformgroup type="vbox">
               <cfformitem type="text" height="20">
                  果物 :
               </cfformitem>
               <cfformgroup type="tile" width="200" label="Tile box">
                  <--- Flash では、すべてのコントロールに対して一意の名前を設定する必要があります。 --->
                  <cfinput type = "Checkbox" name="chk1" Label="Apples"
                     value="Apples">
                  <cfinput type="Checkbox" name="chk2" Label="Bananas"
                     value="Bananas">
                  <cfinput type="Checkbox" name="chk3" Label="Pears"
                     value="Pears">
                  <cfinput type="Checkbox" name="chk4" Label="Oranges"
                     value="Oranges">
                  <cfinput type="Checkbox" name="chk5" Label="Grapes"
                     value="Grapes">
                  <cfinput type="Checkbox" name="chk6" Label="Cumquats"
                     value="Cumquats">
               </cfformgroup>
            </cfformgroup>
         </cfformgroup>
      </cfformgroup>
   </cfformgroup>

   <cfformgroup type="horizontal">
      <cfinput type = "submit" name="submit" width="100" value = "Show Results">
      <cfinput type = "reset" name="reset" width="100" value = "Reset Fields">
      <cfinput type = "hidden" name="oncethrough" value = "Yes">
   </cfformgroup>
</cfform>
TYPE  
  必須、
 
  Flash および XML
 

XML: XSLT で定義されたすべての XForms グループです。ColdFusion MX に同梱されている XSL スキンは、次のタイプをサポートします。

  • horizontal: フォーム内で子タグを水平方向に整列して、このタグの label 属性を子の左に配置します。
  • vertical: フォーム内で子タグを垂直方向に整列して、このタグの label 属性を子の左に配置します。
  • fieldset: HTML fieldset タグに対応します。通常、子の周囲をボックスで囲み、その最上部の一部を凡例テキストに置き換えることにより、子をグループ化します。凡例を指定するには、label 属性を使用します。ボックスの次元を指定するには、style 属性と height および width の値を使用します。このフォームグループ内で cfformgroup type="vertical" を明示的に使用して、子タグを垂直方向に整列する必要があります。
 
   
 

Flash: 次のいずれかでなければなりません。

  • repeater: cfformgroup の子タグまたはクエリーオブジェクトの各行のタグのインスタンスをダイナミックに作成します。その際に、行の数が変わっても ColdFusion で Flash SWF ファイルを再コンパイルする必要はありません。
  • horizontal: フォーム内で子タグを水平方向に整列して、このタグの label 属性を子の左に配置します。このタグを使用して、個々のコントロールを水平方向に整列します。
  • vertical: フォーム内で子タグを垂直方向に整列して、このタグの label 属性を子の左に配置します。このタグを使用して、個々のコントロールを垂直方向に整列します。
  • hbox: 子を水平方向に整列します。このタイプを使用して、フォームコントロールのグループを水平方向に整列します。この属性を使用して個々のコントロールを水平方向に整列しないでください。その場合、子コントロールは正常に整列されません。代わりに、horizontal を使用してください。
  • vbox: 子を垂直方向に整列します。このタイプを使用して、フォームコントロールのグループを垂直方向に整列します。この属性を使用して個々のコントロールを垂直方向に整列しないでください。その場合、子コントロールは正常に整列されません。代わりに、vertical を使用してください。
 
 
 
  • hdividedbox: 子を水平方向に整列します。それぞれの子はボーダー付きのボックス内にあり、ボックス間には分割線があります。ユーザーは、この分割線を動かして子の相対サイズを変更することができます。この属性を含むタグを使用して、フォームコントロールのグループを水平方向に整列します。この属性を使用して、個々のコントロールを水平方向に整列することはできません。
  • vdividedbox: 子を垂直方向に整列します。それぞれの子はボーダー付きのボックス内にあり、ボックス間には分割線があります。ユーザーは、この分割線を動かして子の相対サイズを変更することができます。このタイプを使用して、フォームコントロールをグループ化します。たとえば、hbox フォームグループ内の 1 つの単位としてグループ化します。この属性を使用して、個々のタグを垂直方向に整列しないでください。
  • panel: label 属性のテキスト、ボーダー、および垂直方向に整列された子を持つコンテンツ領域を含むタイトルバーで構成されたコンテナです。
  • tile: 子を長方形のグリッド内に配置します。
  • accordion: 拡張および収縮するアコーディオンプリーツ内に子を配置します。cfformgroup type="page" タグを使用して、各プリーツを定義します。
  • tabnavigator: タブ付きのダイアログ内に子を配置します。cfformgroup type="page" タグを使用して、各タブを定義します。
  • page: 子タグを、垂直方向に整列して、親 tabnavigator の単一のタブ内またはアコーディオンコントロールのプリーツ内に配置します。
QUERY  
  type= repeater の場合に必須、それ以外の場合は無視
 
  Flash
 

repeater と共に使用するクエリーです。Flash は、クエリー内の各行について、cfformgroup タグのそれぞれの子タグのインスタンスを作成します。子タグ内の bind 属性を使って、インスタンスのクエリー行のデータを使用できます。

STARTROW  
  オプション、
 
  Flash
 
Default value: "0"

repeater タイプの場合にのみ使用され、それ以外の場合は無視されます。

Flash フォームの repeater で使用するクエリーの最初の行の行番号を指定します。この属性では 0 が基準です。最初の行は 0 です。ほとんどの ColdFusion タグのような 1 ではありません。

MAXROWS  
  オプション、
 
  Flash
 

repeater の場合にのみ使用され、それ以外の場合は無視されます。

Flash フォームの repeater で使用するクエリー行の最大数を指定します。startrow 属性とこの値の合計を超える数のクエリー行がある場合、repeater では残りの行を使用しません。

LABEL  
  オプション、
 
  Flash および XML
 

フォームグループに適用するラベルです。

Flash では次を実行します。

  • ページまたはパネルグループの場合、対応するアコーディオンプリーツ、tabnavigator タブ、またはパネルタイトルバーに配置するラベルを指定します。Flash の水平または垂直フォームグループの場合、グループの左に配置するラベルを指定します。
  • repeater、hbox、hdividedbox、vbox、vdividedbox、tile、accordion、および tabnavigator の各タイプについては、Flash では無視されます。
STYLE  
  オプション、
 
  Flash および XML
 

Flash: CSS 形式の Flash スタイル仕様です。Flash スタイルの指定に関する詳細については、『ColdFusion MX 開発ガイド』の第29章の「Macromedia Flash 形式のフォームの作成」 を参照してください。

XML: インライン CSS スタイル仕様です。

SELECTEDINDEX  
  オプション、
 
  Flash のみ
 

accordion タイプおよび tabnavigator タイプの場合にのみ使用されます。それ以外の場合は無視されます。開くときに表示するページコントロールを指定します。ここで、0 (1 ではない) はグループに定義された最初のページコントロールを指定します。

WIDTH  
  オプション、
 
  Flash および XML
 

グループコンテナの幅です (単位 : ピクセル)。この属性を省略すると、Flash はコンテナの幅を自動的にサイズ設定します。Flash の repeater タイプの場合は無視されます。

HEIGHT  
  オプション、
 
  Flash
 

グループコンテナの高さです (単位 : ピクセル)。この属性を省略すると、Flash はコンテナの高さを自動的にサイズ設定します。Flash の repeater タイプの場合は無視されます。

ENABLED  
  オプション、
 
  Flash
 
Default value: "Yes"

フォームグループ内のコントロールが有効であるかどうかを指定するブール値です。無効なコントロールはライトグレーで表示されます。

VISIBLE  
  オプション、
 
  Flash
 
Default value: "Yes"

フォームグループ内のコントロールが表示されるかどうかを指定するブール値です。コントロールが表示されない場合、表示されるコントロールが使用するスペースは空白になります。

ONCHANGE  
  オプション、
 
  Flash
 

tabnavigator タイプおよび accordion タイプのみ : 新しいタブまたは accordion ページが選択されたときに実行する 1 つまたは複数の ActionScript 式です。

メモ : onChange イベントが発生するのは、当該フォームが最初に表示されるときです。

TOOLTIP  
  オプション、
 
  Flash
 

マウスポインタをフォームグループ領域の上に置いたときに表示されるテキストです。フォームグループ内のコントロールでもツールチップを示す場合、マウスポインタをそのコントロールの上に置くと Flash はそのコントロールのツールチップを表示します。