Попытка интегрировать Jeditable + MarkItUp и Thickbox / Lightbox - PullRequest
Новая
       9

Попытка интегрировать Jeditable + MarkItUp и Thickbox / Lightbox

3 голосов
/ 19 марта 2010

Мне удалось успешно интегрировать MarkItUp с Jeditable на основе инструкций на этих двух сайтах.Однако я действительно хотел бы, чтобы окно редактирования Jeditable / MarkItUp отображалось в наложении Thickbox или Lightbox.Пока мои попытки сделать это не увенчались успехом.

Итак, на данный момент у меня есть стандартный код: 

$.editable.addInputType('markitup', {
    element : $.editable.types.textarea.element,
    plugin  : function(settings, original) {
        $('textarea', this).markItUp(settings.markitup);
    }
});

$(".editme").editable("/content/save", {
    event   : 'dblclick',
    type      : 'markitup',
    submit    : 'OK',
    cancel    : 'Cancel',
    width     : 640,
    height    : 'auto',
    tooltip   : 'Double-click to edit...',
    onblur    : 'ignore',
    markitup  : mySettings
});

Я нашел здесь другие посты, которые показывают, каквызвать окно редактирования, нажав на ссылку, а не на сам объект, и я попытался интегрировать это с вызовами Thickbox, но безрезультатно.

Буду признателен всем, кто направит меня в правильном направлении.Спасибо!

1 Ответ

2 голосов
/ 01 апреля 2010

Ваша проблема, вероятно, связана с событиями jeditable и markitup, которые не являются "живыми" событиями.

Когда вы (или ваш плагин) привязывает события к определенным элементам при загрузке документа, эти события привязываются только к тем элементам, которые в данный момент находятся в DOM. Если элементы будут добавлены в DOM (вашу страницу) позже (как в случае с плагинами Thickbox / Lightbox), события не будут привязаны к новым элементам DOM.

Решение этой проблемы при нормальных обстоятельствах заключается в использовании живых событий jquery. Но поскольку плагины, которые вы используете (jeditable и markitup), вероятно, делают привязки для вас, у вас нет прямой возможности привязывать события вживую, самостоятельно. Код живого события jquery обычно выглядит примерно так: 

$('a.cool').live('click',function(){
    // Do something cool
});

В этом случае, даже если элемент будет добавлен в DOM позже, он все равно будет привязывать событие к себе.

Ваше решение - либо гуглить тему jquery live для jeditable & markitup (я нашел, но ничего не нашел), либо перейти к их коду самостоятельно. Я посмотрел на jeditable, и там довольно просто, код, который нужно изменить: 

// Change this:
$(this).bind(settings.event, function(e) {
// Into this:
$(this).live(settings.event, function(e) {

и вам также придется изменить функцию отмены привязки: 

// change this:
.unbind($(this).data('event.editable'))
// Into this:
.die($(this).data('event.editable'))

Процесс, вероятно, похож на markitup. Я не смотрел.

...