X-редактируемый плагин bootstrap "скрытая" проблема события на динамически добавляемых элементах

Я не могу заставить "скрытое" событие X-editable работать с динамически добавленными классами (или полями) через JS. Я могу управлять им, только если добавляю редактируемые классы прямо на HTML, но этот подход мне не подходит. Что я делаю не так?

$.fn.editable.defaults.mode = "inline";
$.fn.editable.defaults.onblur = "submit";

$(document).ready(function () {
    $('.field').each(function() {
        $(this).addClass('editable');
    });
    $('.editable').editable();
});

$(document).on('hidden', '.editable', function(e, params) {
    alert('was hidden!');
});

Скрипка:http://jsfiddle.net/4vj8buks/17/

6
javascript twitter-bootstrap x-editable

2 ответов

вы можете подключиться к скрытому событию редактируемого следующим образом:

$.fn.editable.defaults.mode = "inline";
$.fn.editable.defaults.onblur = "submit";

$(document).ready(function () {
    $('.field').each(function() {
        $(this).addClass('editable');
    });

    $('.editable').editable().on('hidden', function (e, params) {
        alert('was hidden!');
    });
});
3

Я не думаю, что принятый ответ действительно устраняет проблему.

скрытое событие не всплывает до уровня документа. Чтобы обойти это, мне пришлось добавить код для настройки события снова везде, где вставлены элементы (что в моем случае было только одно место).

см. здесь для обсуждения этой проблемы, хотя и не очень полезно. https://github.com/vitalets/x-editable/issues/86

0