Как прикрепить обратный вызов к эффекту jquery в диалоговом окне?

Question

Моя проблема в том, что я не знаю, как прикрепить обратный вызов к диалоговому шоу jquery ui.

Шоу на самом деле вариант:

$( ".selector" ).dialog({ show: 'slide' });

Я хочу получить обратный звонок после завершения анимации слайдов. Я посмотрел на сами эффекты, и у них есть обратный вызов:

effect( effect, [options], [speed], [callback] )

Но в диалоге эффект настраивается совсем по-другому. Я попытался также положить:

$( ".selector" ).dialog({ show: 'slide', callback: function() {} });

Но это не сработало.

Предложения?

Answer 1

Обновление 2015-07-27 Для тех, кто использует jQuery v1.10.0 или выше, просмотрите этот другой ответ, поскольку мое решение не будет работать с более новыми версиями jQuery.

---

Оригинальный ответ

Уже ответил, но так как у меня был ответ, я все равно опубликую его…

$('#dialog').dialog({
    show: {
        effect: 'slide',
        complete: function() {
            console.log('animation complete');
        }
    },
    open: function(event, ui) {
        console.log('open');
    }
});

шоу open с последующим animation complete в консоли

Answer 2

Два года спустя предлагаемое решение (автор @andyb) больше не работает в текущих версиях пользовательского интерфейса jQuery (в частности, начиная с v1.10.0). Его решение опиралось на complete Метод обратного вызова - недокументированная особенность.

Я придумал современное решение с использованием jQuery Promise объект:

$("#dialog").dialog({
    show: {
        effect: "drop",
        direction: "up",
        duration: 1000
    },
    hide: {
        effect: "drop",
        direction: "down",
        duration: 1000
    },
    open: function () {
        $(this).parent().promise().done(function () {
            console.log("[#Dialog] Opened");
        });
    },
    close: function () {
        $(this).parent().promise().done(function () {
            console.log("[#Dialog] Closed");
        });
    }
});

Вот обычная демонстрация JSFiddle: http://jsfiddle.net/losnir/jcmpm/

Answer 3

Я скачал пакет jquery ui dev и обнаружил, что для обратного вызова установлено значение "complete":

$( ".selector" ).dialog({ show: 'slide', complete: function() {} });

Спасибо всем, кто пытается помочь решить эту проблему:)

Answer 4

Попробуй использовать open событие диалога:

$( ".selector" ).dialog({
   open: function(event, ui) { ... }
});

Answer 5

Я счел необходимым использовать событие "focus:". Я терял правильно выбранную кнопку из-за шоу: Прекрасные взаимодействия.

focus: function( event, ui ) {
    $(this).siblings('.ui-dialog-buttonpane').find("button:contains('Upload')").focus();
},