X-Editable issue with DataTables

Question

У меня есть Ajax загружен Datatable, и я хотел бы использовать x-editable на своих ячейках. Я уже попробовал простой способ, exatcly, как в примере:

$('a.editable').editable({ 
    type: 'text', 
    pk: 1, 
    name: 'nome', 
    url: 'post.php', 
    title: 'Edit name' 
});: 

на базовой линии внутри <td> как:

<a href='#' class='editable'>Name</a> 

, но он не работает. Единственный способ я нашел, чтобы сделать его работу является:

$(document.body).on('click', 'a.editable', function(e){ 
    $(this).editable('toggle'); 
}); 

с HTML:

<a href="javascript:;" class="" data-pk="id1" data-name="nome" data-type="text" data-url="post.php" data-title="Edit name">Name</a> 

Сейчас он работает, но только в первый раз, то получите пунктирная граница дна и оно не более клики/редактируемые.

Есть ли способ привязать события к элементу внутри ячейки DataTables?

Answer 1

Я, наконец, решил свою проблему. С осторожностью прочитайте документацию:

Как переключать редактируемые. Можно щелкнуть мышью | dblclick | mouseenter | manual.
При установке вручную вы должны вручную вызвать методы отображения/скрытия для редактирования.
Примечание: если вы вызываете show или переключаете внутри обработчика клика некоторого элемента DOM, вам нужно применить e.stopPropagation(), потому что контейнеры закрываются при каждом нажатии на документ.

Пример:

$('.editable').click(function(e) { 
    e.stopPropagation(); 
    $(this).editable('toggle'); 
}); 

Но это было не достаточно, чтобы исправить мою проблему, я должен был изменить с помощью «переключения» на «шоу», но до сих пор не могу понять, почему это лучше, чем другой вариант. Я заметил, что при «переключении» второй щелчок quicly добавляет и удаляет редактируемый popover, но почему? Если у кого-нибудь есть идея.