javascript - How auto sort checkbox list in html -
this question has answer here:
in html form default checkbox , other add dynamically when check checkbox after checkbox order in list shuffled. how sort in as-sending order when load page.
html code here:
<div class="checkbox-list" style="width: auto; height: 100px; overflow-y: scroll;"> <label><div class="checker" id="uniform-ch2"><span><input type="checkbox" id="ch2" name="data[chk_name][]" value="further review"></span></div>further review</label> <label><div class="checker" id="uniform-ch3"><span><input type="checkbox" id="ch3" name="data[chk_name][]" value="hot doc"></span></div>hot doc</label> <label><div class="checker" id="uniform-ch4"><span><input type="checkbox" id="ch4" name="data[chk_name][]" value="potential exhiit"></span></div>potential exhibit</label> <label><div class="checker" id="uniform-ch1"><span class="checked"><input type="checkbox" id="ch1" name="data[chk_name][]" checked="" value="relevant"></span></div>relevant</label> <label><div class="checker" id="uniform-ch5"><span class="checked"><input type="checkbox" id="ch5" name="data[chk_name][]" checked="" value="test"></span></div>test</label> </div>
javascript code file :
$(".checkbox-list lable").sort(function(a, b) { return parseint(a.id) - parseint(b.id); }).each(function() { var elem = $(this); elem.remove(); $(elem).appendto(".checkbox-list"); });
sort order id="uniform-ch2" asc.
you can sort this:
<script> $(".checkbox-list label").sort(function(a, b) { return ($(a).find(".checker").attr("id")) > ($(b).find(".checker").attr("id")); }).appendto(".checkbox-list"); </script>
you had several problems in script:
- you mistyped
lable
in selector - you comparing ids of
label
, not.checker
- you parsing ids, getting nan and, thus, no sorting.
- looping through labels @ end unnecessary
Comments
Post a Comment