モバイルのradioとcheckboxにvalue=""は使っちゃダメ

Read More

モバイルのradioとcheckboxにvalue=""は使っちゃダメ。


まず結果から書くと、
docomoではradio、あるいはcheckboxにvalue=""と設定した状態で送信すると"on"という文字列を受け取る。


おいおい、まじですか?


これに気がついたのはdocomoのiモードHTMLシミュレータⅡを使ってテストをしてる時だった。


これは結構な問題なので実機で検証してみた。


手元にdocomoのP-02と、auのWalkman Phone, Premier3があったのでそれぞれ検証した。
SoftBankは残念ながら手元になかったので未検証。


テストに利用したコードは以下のもの

■submit.php
<html>
<body>
<h1>モバイル送信テスト(サブミット)</h1>
<form action="recive.php" method="post">
  ■radiobutton<br />
  <input type="radio" name="test1" value="1" />1<br />
  <input type="radio" name="test1" value="" />空文字です<br />
  <input type="radio" name="test1" value=null />nullです<br />
  <input type="radio" name="test1" />nothingです<br />

  ■checkbox<br />
  <input type="checkbox" name="test2" value="1" />1<br />
  <input type="checkbox" name="test2" value="" />空文字です<br />
  <input type="checkbox" name="test2" value=null />nullです<br />
  <input type="checkbox" name="test2" />nothingです<br />

  ■selectbox<br />
  <select name="test3">
    <option value="1">1</option>
    <option value="">空文字です</option>
    <option value=null>nullです</option>
    <option>nothingです</option>
  </select>

  <input type="submit" name="submit" value="submit" />
</form>
</body>
</html>



■receive.php
<html>
<body>
<h1>モバイル送信テスト(レシーブ)</h1>
<?php
print_r($_POST);
?>
</body>
</html>



それぞれのテスト結果を残しておく。


以下検証結果。



検証結果を見ればわかるように、
value=""の時とvalueが無指定(value自体を書いてない)の時は
radioとcheckboxはそれぞれ"on"という文字列を受け取っている。

まあvalueが無指定なのはやらないからいいんだけどさ。
想定している通りに動いているのはselectぐらいか。


またdocomoとauとで挙動が違うことにも注目したい。

auではvalue=""でも期待通りの挙動となっている。
まあvalueが無指定の時はやっぱり"on"という文字列を返しているけど。


ちなみにこれはPOSTでやってもGETでやっても結果は同じだった。



つまり総結論としては、

モバイルのradioとcheckboxにvalue=""は使うな!

ってこと。

valueの無指定は論外です。


--
これって結構有名なことなんかね?
俺は今日まで知らなかった。

まあ今も昔もradioもcheckboxもvalue=""なんて使わんけどさ。


あ、でも、
・1万円以上
・10万円以上
・指定しない
みたいなradioボタンの条件もありうるのか…

そういえばchecked="checked"を指定しない場合、画面初期表示時はradioボタンは未選択だったな。
これだとキーも値も送らないから一番いいけど、一回でもradioボタンを選択すると解除できないしなあ。

リセットボタンとかを付けて画面読み直して解除させるか。
あとはプログラム側で"on"の文字列を受け取ったら空にする…いやいやダメダメ。


みんなどうやってるんだろうね。



↓続き:解決編
http://xirasaya.com/?m=detail&hid=261&guid=on


Comments(2)

1  115ちゃん  2012/03/19 (月) 11:52 ID:XXXXXXXXX
こ、こわい。。。
マジですか??(汗)

2  シラサヤ  2012/03/19 (月) 13:22 ID:XXXXXXXXX
少なくとも上記に書いてある実機2つとiモードHTMLシミュレータⅡではそうなる現象は確認できた。

なんなんだろうね、モバイルはそういう仕様でもあるのかな?

スマホでもなったりして…試してないけど。


Category "HTML・JS・CSS" の最新記事