DataTables 1.9 событий, выполняемых на скрытых страницах

Question

Я использую DataTables 1.9 с несколькими строками, но только с одним видимым столбцом. Каждая ячейка в этом столбце представляет собой интерактивный div, который отображает скрытую область содержимого, такую ​​как панель гармоники.

Таким образом, я создал гармонику на каждой странице DataTables на нескольких панелях (строки DataTable) и, в зависимости от количества панелей, гармоника покрывает несколько страниц (DataTable-). На каждой панели заголовка гармоники я устанавливаю флажок для отметки определенных строк для пакетной обработки и других функций.

При выборе флажка я остановить распространение «Нажмите событие», добавив event.stopPropagation в DIV, охватывающий флажок, чтобы сохранить гармонику панели закрыта (должно открываться только при нажатии на гармонику панели вне флажка).

Я думал, что все работает в соответствии с моими пожеланиями, пока я не узнал, что это верно только для первой страницы, которая была отображена после загрузки документа. Флажки на других страницах вообще не реагировали при нажатии на них. Я узнал, что элементы DOM на скрытых страницах DataTable не добавляются в DOM при начальной загрузке страницы. Таким образом, чтобы зафиксировать событие click на тех флажках, которые были первоначально на скрытой странице DataTables, я изменил $(".classname").on(“click", function(){…}); на $(document).on(“click", ".classname”, function(){…});. Это установило флажки на скрытых страницах DataTable , чтобы снова реагировать на событие click.

Но теперь, несмотря на метод stopPropagation();, клик распространяется на панель гармоники и открывается панель.

Я пробовал несколько вариантов: помещение event.stopPropagation() непосредственно в элемент html и в нескольких других местах. Я попробовал комбинации jQuery's .click(), .on(), bind(), delegate() (все в пределах $(document).ready). Так что на данный момент у меня есть либо флажок, который функционирует эстетически, и гармоника остается закрытой, но щелчок не вызывает связанный обработчик событий, или он вызывает обработчик события, но клик распространяется как неуправляемая ракета через страницу. У меня нет простого рабочего примера, извините, но я надеюсь, что кто-то узнает проблему и может указать на решение.

Спасибо, Peter

Answer 1

Читать эту часть https://datatables.net/manual/events

Обратите внимание на использование пространства имен дт при использовании JQuery на() метод, а метод на() будет автоматически добавлять пространство имен для вас ,

Итак, когда вы хотите связать событие прослушивания только к DataTables вам нужно добавить следующее имен: .dt

Так что ваши события связывания должно выглядеть примерно так:

$(document).on("click.dt", ".classname”, function(){…}); // NOTE THE ".td" namespace at the event name 

Теперь этот прослушиватель событий запускается только с помощью события с данными.

Вы можете вручную запустить этот конкретный случай по телефону:

$('.classname').trigger("click.dt"); 

Этот триггер будет игнорировать все другие «обычные» click слушателей событий на вашей странице.