selectボックスのoptionタグのselected属性の書き方
アクセス数もだいぶ落ち着いてきたので久々のエントリ。
HTMLのセレクトボックスに使用するoptionタグを、初期選択状態にするのに selected属性を使用することになりますが、これの書き方について。
3キャリアの携帯で以下のような htmlを書いてテストしてみました。
<html> <head></head> <body> select test<br> <form action="/" method"get"> <select name="hoge"> <option value="1">1</option> <option value="2" selected>2</option> </select> <select name="hoge"> <option value="1">1</option> <option value="2" selected="true">2</option> </select> <select name="hoge"> <option value="1">1</option> <option value="2" selected="selected">2</option> </select> </body> </html>
「2」の値がデフォルト選択されているかというテスト。
で、結果は以下のようになりました。
キャリア | 機種名 | 1つめ | 2つめ | 3つめ |
DoCoMo | P905i | 2 | 2 | 2 |
DoCoMo | P906iC | 2 | 2 | 2 |
au | W31K | 2 | 1 | 2 |
au | A5401CA | 2 | 1 | 2 |
SoftBank | 904SH | 2 | 2 | 2 |
SoftBank | 602SH | 2 | 1 | 2 |
SoftBankの2Gは、もう新規契約ができなかったような気がするので無視していいと思いますが、auは Win端末でも 2つめの記述は理解してくれませんでした。
で、なんで、こんなチェックをしたかというと、Ethnaのフォームヘルパーが、2つめのようなコードを吐くからです。
Ethna_SmartyPlugin.php
「Contents of /ethna/tags/ETHNA_2_3_5/class/Ethna_SmartyPlugin.php - Ethna - SourceForge.JP」
Line:374あたり
<?php //色づけ // {{{ smarty_modifier_select /** * smarty modifier:セレクトボックス用フィルタ * * 単純なセレクトボックスの場合はsmarty関数"select"を利用することで * タグを省略可能 * * sample: * <code> * $smarty->assign("form", 1); * * <option value="1" {$form|select:"1"}>foo</option> * <option value="2" {$form|select:"2"}>bar</option> * </code> * <code> * <option value="1" selected>foo</option> * <option value="2" >bar</option> * </code> * * @param string $string セレクトボックスに渡されたフォーム値 * @param string $value <option>タグに指定されている値 * @return string $stringが$valueにマッチする場合は"selected" */ function smarty_modifier_select($string, $value) { if ($string == $value) { return 'selected="true"'; } } // }}}
line:509あたり
<?php //色づけ // {{{ smarty_function_select /** * smarty function:セレクトフィールド生成 * * @param array $list 選択肢一覧 * @param string $name フォーム項目名 * @param string $value セレクトボックスに渡されたフォーム値 * @param string $empty 空エントリ(「---選択して下さい---」等) * @deprecated */ function smarty_function_select($params, &$smarty) { extract($params); print "<select name=\"$name\">\n"; if ($empty) { printf("<option value=\"\">%s</option>\n", $empty); } foreach ($list as $id => $elt) { printf("<option value=\"%s\" %s>%s</option>\n", $id, $id == $value ? 'selected="true"' : '', $elt['name']); } print "</select>\n"; } // }}}
というわけで、携帯で、form_input系のヘルパーを使い場合には、ここを修正するなどしないと、携帯でちゃんと使えないです。
W3C的にはどうなのだろうか?
「Forms in HTML documents」
英語が苦手で XHTMLのドキュメントとかにたどり着けていない…
あとで、もうちょっと調べてみよう。
とりあえず、htmllintのタグ一覧を見ると、「selected = selected」になってる。
「サービス終了のお知らせ」
追記
wide系IRCサーバの %Ethnaチャンネルで、上記の件を伝えたところ、mumumu_nさんが即効修正してくださいました。
以下、許可をいただいて転載。
やはり、selected="selected" が正しいみたいです。
00:28:41
html 4.01 は
00:29:05selected (selected) #IMPLIED だから、省略可能で、設定する時は selected の値をとる。
00:29:12しかも CIだから case insensitive
00:29:15ということだね
00:29:31http://www.w3.org/TR/html401/interact/forms.html#adef-selected
00:35:33http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-transitional.dtd 00:35:48
00:35:51
%attrs;
00:35:57selected (selected) #IMPLIED
00:36:11http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-strict.dtd
00:36:17これも同様
00:36:38http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-frameset.dtd
00:36:42framesetも同様
00:36:47----
00:36:52以上、xhtml
00:40:10ついでに
00:40:14XHTML Basic もみておくと
00:40:18http://www.w3.org/TR/2000/CR-xhtml-modularization-20001020/abstract_modules.html#s_sformsmodule
00:40:21ここだね
00:40:57http://www.w3.org/TR/2000/REC-xhtml-basic-20001219/#a_dtd
00:41:36間違えた
00:41:39http://www.w3.org/TR/xhtml-modularization/abstract_modules.html#s_sformsmodule
00:41:44最新版はこっちか
00:42:01まあどちらにしても
00:42:04option Common, selected ("selected"), value (CDATA)
00:42:07とあるんで、selectedだね
00:42:11なおしとくー
00:54:31[580] - fixed bug smarty_modifier_select plugin return value is imcompatible with HTML Standards . (thanks: maru_cc)
こういうおかしなところを報告したときの反応速度はすごいです。
いま、ETHNA_UTF8_BRANCHというUTF8のブランチで、Ethna 2.5.0-preview1 が使えます!
が、まだまだバグとか洗い出していたりとか、新機能の追加とか随時行っているので、人柱になってくれる人は使ってみてくださいね。
次期バージョンに期待。