核取方塊陣列就是由很多個核取方塊所組件起來的,形成一個陣列型態,所以如果要取值就不能用個別取值的方法,必須要使用each迴圈來判斷哪些方塊目前是checked狀態,哪些是未checked狀態,可以用以下的方法。
例如像下面這樣的核取方塊陣列要取值!
html結構
<label class=' checkbox-inline checkboxeach'><input id='checkbox' checked='checked' type='checkbox' name='options[3][]' value='1'>學生活動</label>
$("body").on("click", "#checkbox", function (){
var checkedValues = new Array();
$('input:checkbox[id=checkbox]:checked').each(function(i, item)
{
checkedValues.push($(item).val());
//checkedValues為陣列格式,透過$.ajax傳入ajax.php中可以用foreach迴圈解開
});
//AJAX -function
bsortidsortjaxbox($bsortidsortArr=checkedValues);
});
所以核取方塊陣列不管是增加還是取消checked,each迴圈都能取得checked狀態的核取方塊VAR值,這樣就沒問題了,功能都正常,有需要的朋友參考看看!!
例如像下面這樣的核取方塊陣列要取值!
html結構
<label class=' checkbox-inline checkboxeach'><input id='checkbox' checked='checked' type='checkbox' name='options[3][]' value='1'>學生活動</label>
<label class=' checkbox-inline checkboxeach'><input id='checkbox' checked='checked' type='checkbox' name='options[3][]' value='3'>教師活動</label>
<label class=' checkbox-inline checkboxeach'><input id='checkbox' checked='checked' type='checkbox' name='options[3][]' value='47'>教師文康活動</label>
<label class=' checkbox-inline checkboxeach'><input id='checkbox' checked='checked' type='checkbox' name='options[3][]' value='48'>進修與研討</label>
<label class=' checkbox-inline checkboxeach'><input id='checkbox' checked='checked' type='checkbox' name='options[3][]' value='49'>教學觀摩</label>
<label class=' checkbox-inline checkboxeach'><input id='checkbox' checked='checked' type='checkbox' name='options[3][]' value='50'>專題報告</label>
<label class=' checkbox-inline checkboxeach'><input id='checkbox' type='checkbox' name='options[3][]' value='51'>體育與多元活動</label>
<label class=' checkbox-inline checkboxeach'><input id='checkbox' type='checkbox' name='options[3][]' value='52'>校內外各項競賽</label>
<label class=' checkbox-inline checkboxeach'><input id='checkbox' checked='checked' type='checkbox' name='options[3][]' value='53'>節慶與發表</label>
<label class=' checkbox-inline checkboxeach'><input id='checkbox' checked='checked' type='checkbox' name='options[3][]' value='54'>校外教學與營隊</label>
JS-CODE
JS-CODE
var checkedValues = new Array();
$('input:checkbox[id=checkbox]:checked').each(function(i, item)
{
checkedValues.push($(item).val());
//checkedValues為陣列格式,透過$.ajax傳入ajax.php中可以用foreach迴圈解開
});
//AJAX -function
bsortidsortjaxbox($bsortidsortArr=checkedValues);
});
實際來測試一下,當checked減少為4個時,下方的AJAX區塊內容也減為四個!
當checked增加為8個時,下方的AJAX區塊內容也顯示八個內容!
所以核取方塊陣列不管是增加還是取消checked,each迴圈都能取得checked狀態的核取方塊VAR值,這樣就沒問題了,功能都正常,有需要的朋友參考看看!!
教學撰寫:徐嘉裕 Neil hsu
留言
張貼留言