今回は、前回よりもちょっと複雑な入力フォームです。
こちらをクリックしてください。
「ふむふむ。よく見かけるぞ！」
と思われたでしょう。
では、都道府県の選択、誕生日の選択はどんな書き方でしょうか？
もちろんhtmlで書くことはできますが、
都道府県47個、誕生日の年100個なんて、大変大変。
場合によっては、
「都道府県の並びを変えて！」
とか
「都道府県の最初の表示を大阪にして」
とか、
お客様に変更依頼をされることがあります。
せっせとエディタでカットアンドペーストでやりますか？
こんな入力フォームがたくさんあったら、
もう大変ですね。
<cfset title="フォーム入力テスト２">
<cfset tdfk="北海道,青森県,岩手県,宮城県,秋田県,山形県,福島県,茨城県,栃木県,群馬県,埼玉県,千葉県,東京都,神奈川県,新潟県,富山県,石川県,福井県,山梨県,長野県,岐阜県,静岡県,愛知県,三重県,滋賀県,京都府,大阪府,兵庫県,奈良県,和歌山県,鳥取県,島根県,岡山県,広島県,山口県,徳島県,香川県,愛媛県,高知県,福岡県,佐賀県,長崎県,熊本県,大分県,宮崎県,鹿児島県,沖縄県">
<!---解説
tdfkという変数に都道府県をセットしています。
実際のプログラムでは都道府県がセットされています。
長くなるので抜粋しました。
「,」で区切ってありますが、
ColdFusionではリストと呼んでいます。
都道府県の並び順は、ここで変えれば
OKです。
--->
<cfoutput>
<html>
<head>
<title>#title#</title>
</head>
<body>
■#title#<br><br>
<cfif IsDefined("url.chk")>
<cfif url.chk eq "ok">
<!---解説
「url.chk変数がokである場合は？」です。
「eq」はイコールを意味します。
「eq」の代わりに「is」も使うことができます。
否定の場合は「neq」または「is not」です。
ここで演算子を整理すると
演算子 代替名
----------------------------------------------
IS EQUAL,EQ
IS NOT NOT EQUAL,NEQ
GREATER THAN GT
LESS THAN LT
GREATER THAN OR EQUAL TO GTE,GE
LESS THAN OR EQUAL TO LTE,LE
----------------------------------------------
ちなみに、ColdFusionは大文字・小文字の区別はありません。
--->
以下の内容が入力されました。<br>
<br>
○名前<br>
#form.my_name#<br>
○都道府県<br>
#form.tdfk#<br>
○誕生日<br>
#form.year#年#form.month#月#form.day#日<br>
<!---解説
名前、都道府県、誕生日が表示されます。
前回の名前の表示方法と同じです。
--->
</cfif>
<a href="index.cfm">もう一度入力する</a><br>
<cfelse>
以下の内容を入力・選択してください。
<form action="index.cfm?chk=ok" method="post">
<!---解説
actionを見ると、「chk=ok」とあります。
これによってurl.chk変数が生成され、
okの値をセットします。
--->
○名前<br>
<input type="text" name="my_name"><br>
○都道府県<br>
<select name="tdfk">
<cfloop index="i" list="#tdfk#">
<option value="#i#"
<cfif i eq "東京都">selected</cfif>
>#i#</option>
</cfloop>
<!---解説
cfloopタグは「繰り返し」です。
この場合、変数iを宣言し、tdfk変数を使用します。
#tdfk#とありますが、タグ内ではtdfkの内容が展開されます。
<cfloop index="i" list="北海道,青森,沖縄">
と書くことと同じです。
<cfif i eq "東京都">selected</cfif>
とありますが、
iの値が「東京都」だった場合に
selectedをつけます。
これによって最初の画面表示では、
「東京都」が最初に表示されます。
--->
</select>
<br>
○誕生日<br>
<cfset sele_year=dateformat(DateAdd("yyyy",-30,now()),"yyyy")>
<!---解説
sele_year変数に、現在の西暦から30年前の年をセットします。
now()は、現在の日時を取得します。
DateAdd("yyyy",-30,now())
これで30年前の日時を取得します。
dateformatの指定で、年だけを取得します。
--->
<select name="year">
<cfloop index="i" from="#dateformat(dateAdd('yyyy',-100,now()),'yyyy')#" to="#dateformat(now(),'yyyy')#">
<option value="#i#"
<cfif i eq sele_year>selected</cfif>
>#i#</option>
</cfloop>
<!---解説
このcfloopは、変数iを宣言し、100年前の年から現在の年まで繰り返します。
<cfif i eq sele_year>selected</cfif>
とありますが、これはiの値が30年前の年と同じだった場合にselectedをつける
ということです。
--->
</select>
年
<select name="month">
<cfloop index="i" from="1" to="12">
<option value="#i#">#i#</option>
</cfloop>
<!---解説
このcfloopで、月を表示します。
--->
</select>
月
<select name="day">
<cfloop index="i" from="1" to="31">
<option value="#i#">#i#</option>
</cfloop>
<!---解説
このcfloopで、日を表示します。
--->
</select>
日<br>
<input type="Submit" value="実行">
</form>
</cfif>
</body>
</html>
</cfoutput>
うたらぼ
⇒詳しいプロフィール