2016-11-07 16 views
1

私はajax経由でロードするフォームを持っています。フォームをフェッチするために送信されるパラメータによっては、フォームにチェックボックスがない場合や、チェックボックスが1つ以上ある場合があります。チェックボックスがオンの場合のjQueryのチェック

チェックボックスがページに存在するかどうかをチェックしたい場合は、選択されていない場合、検証中にユーザーに選択を求めるプロンプトが表示されます。

存在する場合、チェックボックスは同じクラスと異なるIDを持ちます。

<input type="checkbox" name="associatedClass" 
value="$associatedClsNumVal" class="getAssociatedClass" 
id="$associatedClsNumVal" /> 

最適なアプローチは何ですか?ページに/フォームにチェックボックスがある場合、jqueryは「センス」できますか?

ありがとうございました。


私の以前の投稿のおかげでありがとうございます。私は同じタイプの問題としてこれに追加しています。

1つ以上のチェックボックスグループがあるページがあり、各グループでチェックボックスを1つだけオンにする必要があります。

ページが読み込まれるまでのグループ数はわからないので、これを確認するにはどうすればよいでしょうか?

ありがとうございます!

+1

、チェックボックスがある場合、 '$( '入力[タイプ=チェックボックス]')'正の長さになります。 – David

+1

Ditto '$( 'input [name =" associatedClass "]')'と '$("。getAssociatedClass ")' – mplungjan

答えて

3

最も簡単な方法は、ページにタイプチェックボックスの入力があるかどうかを確認することです。 jQueryを使用すると、input[type="checkbox"]などのCSSセレクタを使用してDOMの要素を見つけることができます。それを.lengthと組み合わせると、そのページにいくつあるかを知ることができます。あなたは、あなたが特定の要素に検索を制限することができ、検証たくないページ上の他のチェックボックスがあるかもしれない場合は、このための完全なjQueryのコードは

if ($('input[type="checkbox"]').length) { 
    // Validate checkboxes 
} 

だろう。たとえば、IDがmyFormの特定のフォーム内のチェックボックスを検証する場合は、フォームを選択して.find()を使用して、そのフォーム内のチェックボックスのみを検索することができます。

if ($('#myForm').find('input[type="checkbox"]').length) 
{ 
    // Validate checkboxes 
} 

ただし、検証して、あなたはおそらく、個別ので、代わりに各入力を確認したいだけで、我々は、すべてのチェックボックスと、その後のプロセスを見つけるために.eachを使用することができますページ上の少なくとも一つのチェックボックスがあることを確認するために長さをチェックしますそれらは一度に1つです。

$('input[type="checkbox"]').each(function() { 
    // Validate this checkbox 
}); 

ことの利点は、ページ上の何も存在しない場合、それは試してみて、検証何かをして、それは完全に有効ですので、我々は、任意のは、私たちの検証の前にあるかどうかを確認する必要はありませんではないでしょうです。

+0

これは私が思ったより簡単でした。どうもありがとう。 – Gman

+0

@Gman喜んで私は助けることができます。他の人が同じ問題を将来解決するのを助けるために、アップボートしてその答えを正しいとマークすることを忘れないでください。 – Styphon

2
$(':checkbox').length 

は、ページ上のすべてのチェックボックスの数を取得します。より具体的にする必要がある場合は、共通のクラスを与えることで、これを絞り込むことができます。単に '1節' クラスでのチェックボックスをカウントする例えば

、:

まあ
var $checks = $('.section1:checkbox'); 
console.log('There are ' + $checks.length + ' checkboxes'); 

https://jsbin.com/bowasi/edit?html,js,console,output

関連する問題