I am using kendo UI. I have a dropdown list of checkboxes. The onchange event is fireing when user clicks on checkbox. But the event is not firing when user clicks on text.
Thanks in advance for ur help! -Sai.
<script type="text/x-kendo-template" id="CheckboxTemplate">
<li unselectable="on" class="k-item nowrap check-item">
<input type="checkbox" name="#= text #" value="#= value #" class="check-input showcolname" checked />
<span>#= text #</span>
</li>
</script>
function populateDropdown() {
dropdown = $("#dropDownList").kendoDropDownList({
dataTextField: "text",
dataValueField: "value",
template: $("#CheckboxTemplate").html(),
dataSource: displayColumns,
placeholder: "Select...",
select: function(e) {
e.preventDefault();
}
}).data("kendoDropDownList");
dropdown.list.width(250);
dropdown.list.find(".check-input,.check-item").bind("click", function(e) {
var $item = $(this);
var $input;
if($item.hasClass("check-item")) {
// Text was clicked
$input = $item.children(".check-input");
$input.prop("checked", !$input.is(':checked'));
} else {
// Checkbox was clicked
$input = $item;
}
// Check all clicked?
if($input.val() == "") dropdown.list.find(".check-input").prop("checked", $input.is(':checked'));
syncColumns();
e.stopImmediatePropagation();
});
}
function syncColumns(){
$('.showcolname').each(function() {
$(this).change(function(event) {
event.preventDefault();
var val = $(this).val();
var url = "${rootContext}${MyUrl}/"+val+"/"+this.checked;
var beforeSendCallBack = function() {};
var successCallback = function(data) {};
submitPost(url, beforeSendCallBack, successCallback, '','');
});
});
}
Aucun commentaire:
Enregistrer un commentaire