結果が既に入力されているテーブルがあります。テーブルの内容を操作するために使用したいチェックボックスもあります。
チェックボックス:
ブランチ
- あ
- B
- ハ
私のテーブルはこんな感じ
- 名前|年齢|支店
- アダム、12、A
- ジオ、20、B
チェックした内容に基づいて、テーブルの行を削除および追加できるようにしたいと考えています。私はこれまでのところ jQuery を初めて使用しています。
function sortByBranch() {
j$('#sfiltersb li label input[type="checkbox"]').bind("change", function(){
if(j$(this).hasAttr("checked"){
//do something
}
});
}
HTML
<ul id="haystack" class="slist">
<li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-aa" value="AA" checked="checked" class="scritb" />Branch AA</label></li>
<li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-ab" value="AB" checked="checked" class="scritb" />Branch AB</label></li>
<li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-ac" value="AC" checked="checked" class="scritb" />Branch AC</label></li>
<li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-ba" value="BA" checked="checked" class="scritb" />Branch BA</label></li>
<li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-bb" value="BB" checked="checked" class="scritb" />Branch BB</label></li>
<li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-bc" value="BC" checked="checked" class="scritb" />Branch BC</label></li>
<li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-ca" value="CA" checked="checked" class="scritb" />Branch CA</label></li>
<li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-cb" value="CB" checked="checked" class="scritb" />Branch CB</label></li>
<li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-cc" value="CC" checked="checked" class="scritb" />Branch CC</label></li>
<li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-da" value="DA" checked="checked" class="scritb" />Branch DA</label></li>
<li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-db" value="DB" checked="checked" class="scritb" />Branch DB</label></li>
<li><label class="checkbox" style="cursor:pointer;"><input type="checkbox" name="branch-dc" value="DC" checked="checked" class="scritb" />Branch DC</label></li>
</ul>
<button type="submit" class="btn" id="branch-search-btn" style="width:100%; font-size:13px; min-height:30px;">Search</button>