Friday, 21 November 2014

Multiple checkbox selection

// checkbox selection
function checkBoxSelect(parentId, childContainer, elementToSet) {

var selectedPhonesArray = [];

$(parentId).on('ifToggled', function(event) {
/**
* Multiple selection
*/
var isChecked = event.target.checked
if(isChecked){
$('.display').val('All').attr("readonly", true);
$("input[type='checkbox']", childContainer).iCheck("check");
$(elementToSet).val('ALL')
} else {
$('.display').val('').attr("readonly", false);
$("input[type='checkbox']", childContainer).iCheck("uncheck");
$(elementToSet).val('')
}
});

/**
* Individual de-selection on the childern checkbox will remove the parent checkbox
* and selecting all the childern checkbox will enable the parent checkbox
*/
$('.chkbox').each(function() {
$(this).on('ifToggled', function(event) {
var mulIsChecked = event.target.checked
var allChkboxesLength = $(childContainer + ' .chkbox').length
var checkedLength = $(childContainer).find('.chkbox:checked').length

var value = $(this).data("value")
// adding and removing values to the hidden field
if(mulIsChecked){
if(value != undefined && value != ""){
selectedPhonesArray.push(value)
}
$(elementToSet).val(selectedPhonesArray);
} else{
for(var i=0; i<selectedPhonesArray.length; i++){
if(selectedPhonesArray[i] == value){
selectedPhonesArray.splice(i, 1);
}
}
$(elementToSet).val(selectedPhonesArray);
}

// multiple select/de-select
if(mulIsChecked && allChkboxesLength == checkedLength){
$(parentId).parent().addClass("checked", "checked");
$(elementToSet).val('ALL');
} else {
$(parentId).parent().removeClass("checked");
}
});
});

}

No comments:

Post a Comment