チェックボックスにチェックできる数を制限する

タイトルそのままのサンプルを見ていきます。動くサンプルはこちら。仕様は以下のようにします。

  • 指定個数以上チェックしようとするとアラートを出す方法もあるけれど、そうではなく、指定個数にチェックを付けると、他のチェックボックスを無効にする(クリックできなくする)
  • 初期の画面表示時にも処理する

1番目はそのままとして、2番目ですが、初期の画面表示時にも制限処理を施すということです。デフォルトで指定個数にチェックが入っている時は、他のチェックボックスは、チェックできなくなります。編集時やエラーで戻ってきた時には、必要な機能です。ということで、以下がサンプルになります。

jQueryのイベントハンドラーには、何かと無名関数が好まれる傾向にありますが、今回のケースだと、それだと何かと都合悪いです。(できないことは無いですが)

コードは、大体見ての通りなので、細かい説明は省略します。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です