CFSELECT | |||||
説明
ドロップダウンリストボックスのフォームコントロールを構築します。cfform タグ内で使用します。クエリーから、または HTML option タグを使用して、リストにデータを挿入できます。 |
|||||
カテゴリ
フォームタグ | |||||
シンタックス<cfselect name = "name" label = "label" style = "style specification" size = "integer" required = "yes"、"no" message = "text" onError = "text" multiple = "yes"、"no" query = "queryname" value = "text" display = "text"> group = "query column name queryPosition = "above"、"below" selected = "value or list" onKeyUp = "JavaScript or ActionScript" onKeyDown = "JavaScript or ActionScript" onMouseUp = "JavaScript or ActionScript" onMouseDown = "JavaScript or ActionScript" onChange = "JavaScript or ActionScript" onClick = "JavaScript or ActionScript" visible = "Yes"、"No" enabled = "Yes"、"No" tooltip = "tip text" height = "number of pixels" Flash の場合のみ width = "number of pixels" Flash の場合のみ > HTML オプションタグ (省略可能) </cfselect> |
|||||
関連項目
cfapplet、cfcalendar、cfform、cfformgroup、cfformitem、cfgrid、cfinput、cfslider、cftextarea、cftree、『ColdFusion MX 開発ガイド』の第26章の「データの取得および形式設定について」 |
|||||
ヒストリ
ColdFusion MX 7:
次の表は、ColdFusion が直接使用する属性のリストです。このリストに記載されていない HTML select タグ属性もすべてサポートされ、ブラウザに直接渡されます。
|
|||||
使用方法
このタグには終了タグが必要で、HTML option 子タグおよび optgroup 子タグを含めることができます。 選択したリストボックスの項目をポストバック全体にわたって確実に保持するには、cfform の preserveData 属性をクエリーから生成されたリストと共に使用します (この方法は、クエリーから挿入されたデータでのみ機能します)。 cfform の preserveData 属性が true でフォームが同じページに送信される場合に、コントロール用のデータがクエリーから挿入されると、cfselect コントロール用に送信された選択肢が Selected 属性の値の代わりに使用されます。正規の HTML の option タグが挿入されるコントロールの場合、開発者は Selected 属性を適切な option タグに動的に追加する必要があります。 group オプションでは、SQL GROUP BY シンタックスを使用したクエリーが生成され、group 列のフィールド名の下にあるインデントされたリストに各グループの value 列エントリが配置されます。このオプションにより、各エントリの HTML optgroup タグが group 列に生成されます。 </option> 終了タグがある cfselect タグ本文内の各 HTML option タグを閉じます。このタグを閉じないで queryPosition="below" を指定した場合、クエリーからの最初の項目がリストに表示されないことがあります。 このタグを正しく動作させるには、JavaScript 対応のブラウザを使用する必要があります。 詳細については、cfform タグのエントリを参照してください。 |
|||||
例
次の例では、部門別にグループ化された全従業員のリストから 1 人以上の従業員名を選択します。選択した名前とその従業員の電子メールアドレスが表示されます。全従業員のデータを取得するオプションもあります。 <!--- 従業員名をデータベースから取得します。 ---> <!--- SQL を使用して、姓名を指定する Name フィールドを作成します。 ---> <cfquery name = "GetAllEmployees" dataSource = "cfdocexamples" cachedwithin="#createTimeSpan(0,1,0,0)#"> SELECT Emp_ID, EMail, Phone, Department, FirstName, LastName, FirstName +' ' +lastName as Name FROM Employees GROUP BY Department, Emp_ID, EMail, Phone, FirstName, LastName, FirstName </cfquery> <h2>cfselect の例</h2> <!-- フォームが送信された場合、cfif ステートメントは true です。 選択した名前を示します。 ---> <cfif IsDefined("form.employeeid")> <!--- フォームは送信されました。 ---> <h4>次の従業員を選択しました。</h3> <cfif form.employeeid IS ""> <!--- [すべてを選択] オプションを選択しました。全従業員を表示します。 ---> <cfoutput query="GetAllEmployees"> #name#<br> Email:#email#<br><br> </cfoutput> <cfelse> <!--- クエリーオブクエリーを使用して、選択したユーザーのデータを取得します。 Form.employeeid は、選択した従業員 ID のカンマ区切りリストです。 ---> <cfquery name = "GetSelectedEmployees" dbtype="query"> SELECT Emp_ID, EMail, Phone, Department, FirstName, LastName, FirstName +' ' +lastName as Name FROM GetAllEmployees WHERE Emp_ID in (#form.employeeid#) </cfquery> <!--- クエリーから名前と電子メールアドレスを表示します。 ---> <cfoutput query="GetSelectedEmployees"> #firstName# #lastName#<br> Email:#email#<br> <br> </cfoutput> </cfif> </cfif> <!--- cfform タグで現在のページに戻ります。 ---> <h3>従業員を 1 人以上選択します。</h3> <cfform action = "#CGI.SCRIPT_NAME#"> <!--- cfselect を使用して、部門別にグループ化された、クエリーの LastName 列を表示します。 複数選択が可能です。---> <cfselect name = "employeeid" size = "15" multiple="yes" required = "Yes" message = "Select one or more employee names" query = "GetAllEmployees" group="Department" display ="name" value ="emp_id" queryPosition="Below"> <!--- 全従業員を選択するオプションを追加します。 ---> <option value = "">Select All</option> </cfselect><br><br> <input type="Submit"> </cfform> |
NAME | |
必須 | |
すべて | |
選択フォーム要素の名前です。 |
LABEL | |
オプション | |
Flash および XML | |
Flash または XML 形式のフォーム内でコントロールの横に配置するラベルです。 |
STYLE | |
オプション | |
すべて | |
HTML または XML 形式フォームでは、ColdFusion は style 属性をブラウザまたは XML に渡します。 Flash 形式では、対応する Flash 要素について、Macromedia Flex で使用するものと同じシンタックスおよびコンテンツを使用する CSS 形式のスタイル仕様でなければなりません。 |
SIZE | |
オプション | |
すべて | |
Default value: "1"
一度に表示するエントリの数です。デフォルト値の 1 では、ドロップダウンリストが表示されます。それ以外の値を指定すると、size の数のエントリを一度に参照できるリストボックスが表示されます。 |
REQUIRED | |
オプション | |
すべて | |
Default value: "No"
メモ : size 属性を省略した場合や、値を 1 に設定した場合は、表示されている項目が常に送信されるので、この属性の設定は無効になります。value=" " (引用符の間に空白文字があることに注意してください) である初期 option タグを使用することにより、この形式フォームの問題を解決できます。
|
MESSAGE | |
オプション | |
すべて | |
required = "Yes" の場合で選択が行われていないときに表示されるメッセージです。 |
ONERROR | |
オプション | |
HTML および XML | |
検証に失敗した場合に実行するカスタム JavaScript 関数です。 |
MULTIPLE | |
オプション | |
すべて | |
Default value: "No"
|
QUERY | |
オプション | |
すべて | |
ドロップダウンリストに挿入するクエリーの名前です。 |
VALUE | |
オプション | |
すべて | |
各リスト要素の値に使用するクエリー列です。query 属性と共に使用します。 |
DISPLAY | |
オプション | |
すべて | |
Default value: "value 属性の値"
各リスト要素の表示ラベルに使用するクエリー列です。query 属性と共に使用します。 |
GROUP | |
オプション HTML および XML | |
ドロップダウンリスト内の項目を 2 つのレベルで構成された階層型のリストにグループ化するために使用するクエリー列です。 |
QUERYPOSITION | |
オプション | |
すべて | |
Default value: "above"
オプションリストにクエリーを挿入し、HTML option 子タグを使用して追加エントリを指定する場合は、option タグの項目に関連するクエリーから、その項目の場所を判断します。
|
SELECTED | |
オプション | |
すべて | |
選択リストであらかじめ選択しておく 1 つ以上のオプション値です。複数の値を指定するには、カンマ区切りのリストを使用します。この属性は、選択リスト項目がクエリーから生成される場合のみ適用されます。cfform preservedata 属性の値でこの値を上書きできます。 |
ONKEYUP | |
オプション | |
すべて | |
ユーザーがコントロールでキーボードのキーを離したときに実行される JavaScript (HTML/XML の場合) または ActionScript (Flash の場合) です。 |
ONKEYDOWN | |
オプション | |
すべて | |
ユーザーがコントロールでキーボードのキーを押したときに実行される JavaScript (HTML/XML の場合) または ActionScript (Flash の場合) です。 |
ONMOUSEUP | |
オプション | |
すべて | |
ユーザーがコントロールでマウスボタンを押したときに実行される JavaScript (HTML/XML の場合) または ActionScript (Flash の場合) です。 |
ONMOUSEDOWN | |
オプション | |
すべて | |
ユーザーがコントロールでマウスボタンを離したときに実行される JavaScript (HTML/XML の場合) または ActionScript (Flash の場合) です。 |
ONCHANGE | |
オプション | |
すべて | |
ユーザーのアクションに応じてコントロールが変わるときに実行される JavaScript (HTML/XML の場合) または ActionScript (Flash の場合) です。 |
ONCLICK | |
オプション HTML および XML | |
ユーザーがコントロールをクリックしたときに実行される JavaScript です。 |
ENABLED | |
オプション Flash | |
Default value: "Yes"
コントロールを有効にするかどうかを指定するブール値です。無効なコントロールはライトグレーで表示されます。disabled 属性の逆です。 |
VISIBLE | |
オプション Flash | |
Default value: "Yes"
コントロールを表示するかどうかを指定するブール値です。表示されないコントロールが使用するスペースは空白です。 |
TOOLTIP | |
オプション Flash | |
マウスポインタをコントロールの上に置いたときに表示されるテキストです。 |
HEIGHT | |
オプション Flash | |
コントロールの高さをピクセル単位で指定します。 |
WIDTH | |
オプション Flash | |
コントロールの幅をピクセル単位で指定します。 |