table rows with checkboxes get built in AJAX so I need to delegate a live function for the change event. When the toggle-all checkbox in main div is checked all the checkboxes in the table rows get checked. Toggle-all checkbox working.
The problem is when there is only one row with checkbox, not checked and it changes and gets checked, then the toggle-all checkbox should get checked. Similarly when all of the checkboxes in the rows are checked and one is unchecked, the toggle-all checkbox should get unchecked.
I have tried to get the delegated live event to work on a function to check/uncheck the toggle-all switch but it doesn't. As I understand it? the input:checkbox is bound to the class .table .checkall . And if there is a change either way in the checkboxes then it should change the toggle-all switch in main div? but it isn't can you tell me why? thanks!!!!!
$('input:checkbox').delegate('.table .checkall','change', function () {
$('#toggle-all').prop("checked", !'.table .checkall'.not(":checked").length);
});
I have a question, is this function supposed to be in an anonymous function like the toggle-all function?
AJAX success call and the toggle-all function which works.
------------------------------------------- AJAX success and the toggle-all function------------
success: function(data) {
var checkbx ='<input type="checkbox" class="checkall" >';
var delRow = '<input type="button" $(this).data("itemid"); class="btnDelete">';
var myTable ='<table class="table"><tbody id="tbody">';
myTable += '<\/tbody></\table>';
myTable = $('#response').append(myTable).find('tbody');
$.each(data, function(idx,item) {
var
row =
'<tr><td>'+checkbx +" " +item.todo +'<\/td><td>'+item.name+'<\/td><td>'+item.date +delRow + '<\/td><\/tr>';
myTable.append(row);
myTable.append(row).find('.btnDelete').last().data('itemid',item.id);
});//end each
}
//end success
}); //end AJAX
});//end document ready
$(function () {
var $toggleAll = $("#toggle-all");
$toggleAll.change(function () {
$('.table .checkall').prop("checked", $toggleAll.is(":checked"));
});
});