Не могу разобраться с делегированием
Пытаюсь заставить работать плагин iCheck на контент подгруженный через AJAX (вначале загружается вся страница и сразу же document ready идет второй запрос через AJAX).
Есть такое <div id="ajax_result"></div> Гружу в него такое (много чекбоксов) <input type="checkbox" class="minimal" value="on" checked="" /> ... <input type="checkbox" class="minimal" value="on" checked="" /> Если контент загружается сразу (есть в DOM), то проблем подключить плагин не составляет (естественно jquery присутствует, подключаем плагин и инициализируем его) - так все работает. <script src="plugins/iCheck/icheck.min.js"></script> <script> //iCheck for checkbox and radio inputs $('input[type="checkbox"].minimal').iCheck({ checkboxClass: 'icheckbox_minimal-blue', radioClass: 'iradio_minimal-blue' }); </script> На AJAX контенте, пока не получается. Накодил такого $('#ajax_result').on('ajax_result', 'input[type="checkbox"].minimal', iCheck({ checkboxClass: 'icheckbox_minimal-blue', radioClass: 'iradio_minimal-blue' }) ); $('#ajax_result').triggerHandler('ajax_result'); и подключил <script src="plugins/iCheck/icheck.min.js"></script> <script src="client/search/init_icheck.js"></script> Т.е. сделал свое событие ajax_result В консоли ошибка "ReferenceError: iCheck is not defined" Подозреваю, что чето не правильно сделал. Помогите пжлст. |
Думаю, дело в том, что ты вызвал iCheck как обычную функцию, а это jQuery функция, которая должна вызываться на DOM-элементе.
т.е. должно быть по идее что-то вроде этого $('#ajax_result').on('ajax_result', 'input[type="checkbox"].minimal', function() { $(this).iCheck({ checkboxClass: 'icheckbox_minimal-blue', radioClass: 'iradio_minimal-blue' }); ); ещё как вариант, можно следить за появлением новых инпутов $(document).on('change','input[type="checkbox"].minimal', function(){ $(this).iCheck({ checkboxClass: 'icheckbox_minimal-blue', radioClass: 'iradio_minimal-blue' }); }); |
Цитата:
Короче чтобы не тянуть кота за я... :) Решил проблему, может кому пригодиться. В скрипт ajax (конкретно я запихнул следующий код в success после выполнения всей функции по success), запихиваем следующее // создаем событие успешного request $('#ajax_result').trigger('requestsuccess'); Т.е. тупо вручную создаем событие. А дальше в самом скрипте инициализации плагина, ловим это событие $('#ajax_result').bind('requestsuccess', function() { $('input[type="checkbox"].minimal').iCheck({ checkboxClass: 'icheckbox_minimal-blue' }); }); Это решение справедливо для любого плагина или просто самописного скрипта :) |
razorg1991,
зачем тригер то, если можно сразу success: function() { $('input[type="checkbox"].minimal').iCheck({ checkboxClass: 'icheckbox_minimal-blue' }); } |
Цитата:
|
Часовой пояс GMT +3, время: 18:06. |