Flask/jQueryクラス別にすべてを選択

Question

1つのチェックボックスでグループ内のすべての項目を選択できます。このコードですべてのチェックボックスを選択できることがわかりました。

<script> 
$('#checkAll').click(function() { 
    $('input:checkbox').prop('checked', this.checked); 
}); 
</script> 

私が行った.classNameを使用して選択したいフィールドのクラスを使用することをおすすめしました。そして

<script> 
$('#checkAll').click(function() { 
    $('input:checkbox.CheckThese').prop('checked', this.checked); 
}); 
</script> 

を持って、私はwtformsを使用していますので、ここで示唆したように、私はフィールドにクラスを渡さ：私はこれらを変更するとすぐにHTML

<form method="POST" action="{{ url_for('form') }}"> 
    {{ form.csrf_token }} 
    <h3>Building 100</h3> 
    <input type="checkbox" id="checkAll"/>Select All 

    {{ form.B100_Enc_Dec(class_="CheckThese") }} 
    {{ form.B100_Net(class_="CheckThese") }} 

    <h3>Building 200</h3> 
     {{ form.B200_Enc_Dec }} 
     {{ form.B200_Net }} 

    <h3>Building 201 North</h3> 
     {{ form.B201N_Enc_Dec }} 
     {{ form.B201N_Net }} 

</form> 

を与えた Add a css class to a field in wtform

ボタン自体は何も選択しなくなりました。私はすべてのデバイスをビルドすることで選択できる必要がありますが、動作させることはできません。

編集： HTML出力は次のようになります。

<form method="POST" action="/form"> 
        <input id="csrf_token" name="csrf_token" type="hidden" value="---"> 
        <h3>Building 100</h3> 
        <input type="checkbox" id="checkAll"/>Select All 
        <ul class="CheckThese" id="B100_Enc_Dec"> 
<li><input id="B100_Enc_Dec-0" name="B100_Enc_Dec" type="checkbox" value="10.203.81.151"> <label for="B100_Enc_Dec-0">608 Decoder</label></li> 
<li><input id="B100_Enc_Dec-1" name="B100_Enc_Dec" type="checkbox" value="10.203.81.152"> <label for="B100_Enc_Dec-1">601 Decoder</label></li> 
<li><input id="B100_Enc_Dec-2" name="B100_Enc_Dec" type="checkbox" value="10.203.81.153"> <label for="B100_Enc_Dec-2">ALC1 Decoder</label></li> 
<li><input id="B100_Enc_Dec-3" name="B100_Enc_Dec" type="checkbox" value="10.203.81.154"> <label for="B100_Enc_Dec-3">ALC2 Decoder</label></li> 
<li><input id="B100_Enc_Dec-4" name="B100_Enc_Dec" type="checkbox" value="10.203.81.155"> <label for="B100_Enc_Dec-4">ALC3 Decoder</label></li></ul> 

Answer 1

うわー。

クラスを_classメソッドを使用してwtformsチェックボックスフィールドに割り当てると、それをulタグに割り当てます。したがって、あなたのスクリプトでは、ボックスを次のように選択する必要があります。

$('#checkAll').click(function() { 
    $('ul.CheckThese li input').prop('checked', this.checked); 
});