jQueryでラジオボタンとセレクトボックスが選択されているかのバリデーション

jQueryを使って、form送信時に
ラジオボタンが選択されているかのバリデーションチェック、
セレクトボックスが選択されているかのバリデーションチェック、
をつくります。

jQuery関連記事

1. ラジオボタンが選択されているかのバリデーションチェック

HTML

<div>
  <input type="radio" name="gender" value="1" id="man">
  <label for="man">男性</label>
</div>
<div>
  <input type="radio" name="gender" value="2" id="wmn">
  <label for="wmn">女性</label>
</div>
<button id="require_check">確認</button>

JavaScript(function)

function radio_check(name, category) {
  var c = 0;
  $('input[name=' + name + ']').each(function () {
    if ($(this).prop('checked')) { c++; }
  });
  if (!c) {
    $('#errorbox').append(category + "を選択してください。<br>");
  }
}

ラジオボタンはグループとして扱うため、name属性が同じになるので、それを利用します。
functionの引数である、nameに該当のname属性を渡すことで、いろんな場所でラジオボタンの必須チェックができるようになります。
全ての該当name属性を確認しに行って、選択されていればcをインクリメント。
最終的にcが0ならエラーを出します。

JavaScript(呼び出し側)

$('#require_check').click(function () {
  radio_check("gender", "性別");
});

functionの引数である、nameにgenderを、categoryにエラー時に表示する項目を渡して呼び出します。

2. セレクトボックスが選択されているかのバリデーションチェック

HTML

<select id="pref_id" name="pref_id">
  <option value="">選択</option>
  <option value="23">愛知県</option>
  <option value="21">岐阜県</option>
  <option value="24">三重県</option>
</select>
<button id="require_check">確認</button>

JavaScript(function)

function select_check(idname, category) {
  var selected = $('#' + idname + ' option:selected');
  if (!selected.val()) {
    $('#errorbox').append(category + "を選択してください。<br>");
  }
}

セレクトボックスにidを振って、それを利用します。
functionの引数である、idnameに該当のid属性を渡すことで、いろんな場所でセレクトボックスの必須チェックができるようになります。
選択されているoptionのvalueを取得し、空ならエラーを出します。

JavaScript(呼び出し側)

$('#require_check').click(function () {
  select_check("pref_id", "都道府県");
});

functionの引数である、idnameにpref_idを、categoryにエラー時に表示する項目を渡して呼び出します。