Не могу разобраться с делегированием
Пытаюсь заставить работать плагин 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, время: 02:45. |