Phil Phil - 1 month ago 5
jQuery Question

How do I event delegate this filtered jquery object

I have this JQuery object returned from a filter call which I attach an event to like so.

visibleCascadeParentCheckbox = $('.checkbox[data-cascade]:not(.hidden)').filter(function(){
return !$(this).parents('td').hasClass('nested')
});

$(visibleCascadeParentCheckbox).on('change', function() {...});


But I need to do event delegation on it like so

$('.table').on('click', ****selector from visibleCascadeParentCheckbox****, function() {..});

Answer

You'll need to perform the filter-check in the event handler:

$('.table').on('click', '.checkbox[data-cascade]:not(.hidden)', function() {
    if ($(this).parents('td').hasClass('nested')) return; // exit!
    // your code...
});

NB: there is no use in reusing the visibleCascadeParentCheckbox selection you have, since the table may have changed, making the selection outdated. You would not benefit from the more dynamic character of event-delegation.

Comments