jQueryValidationのチェックルールその3

jQueryValidationのチェックルールその3

script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js">

ラジオボタンのチェック

radioボタンが選択かれているかチェックする
これは、アンケートなどに使う

<div data-role="fieldcontain">
<fieldset data-role="controlgroup">
<legend>今回のゲームの評価</legend>

<input type="radio" name="review" id="good" value="1" required/>
<label for="good">良かった</label>

<input type="radio" name="review" id="normal" value="2" />
<label for="normal">普通</label>

<input type="radio" name="review" id="bad" value="3"/>
<label for="bad">いまいち</label>

<label for="review" class="error" style="display:none;"/>チェックしてください</label>

</fieldset>
</div>

ラジオボタンの name=””は同じにして
id=”” は識別できるようにバラバラにする

label の for=”” には、それぞれ対応するラジオボタンの id=”” の中身を指定

エラーメッセージの label だけは
ラジオボタンの for=”” の中身を指定

このように
ラジオボタンのどれか1つに
requiredをつければ必須チェックがかかる

また、デフォルトだとボタンの上にメッセージがでてしまうため
class=”error”
で、エラーメッセージの位置を変更している