¿Cómo adjuntar devolución de llamada al efecto de jquery en el show de diálogo?


Mi problema es que no sé cómo adjuntar devolución de llamada al cuadro de diálogo de interfaz de usuario de jquery.

El show es en realidad una opción:

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

Quiero tener una devolución de llamada después de que se complete la animación de la diapositiva. Miré a partir de los efectos en sí y tienen una devolución de llamada:

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

Pero en el diálogo el efecto se configura de manera muy diferente. Intenté también poner:

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

Pero no funcionó.

Sugerencias?

Author: Pehmolelu, 2011-08-03

5 answers

Actualización 2015-07-27 Para cualquier persona que use jQuery v1.10.0 o superior, consulte esta otra respuesta ya que mi solución no funcionará con versiones más recientes de jQuery.


Respuesta original

Ya respondió, pero ya que tenía una respuesta, voy a publicarlo de todos modos {

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

Muestra open seguido de animation complete en la consola

 38
Author: andyb,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-05-23 11:46:09

Dos años más tarde, la solución sugerida (por @andyb) ya no funciona en las versiones actuales de jQuery UI (específicamente desde v1.10.0). Su solución se basó en el método de devolución de llamada complete, una característica indocumentada .

Se me ocurrió una solución actualizada, usando jQuery Promise objeto:

$("#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");
        });
    }
});

Aquí está la demostración habitual de JSFiddle: http://jsfiddle.net/losnir/jcmpm /

 31
Author: losnir,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-07-28 05:13:11

He descargado el paquete de jquery ui dev y he descubierto que la devolución de llamada se establece con "completo":

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

Gracias por todo el mundo tratando de ayudar a resolver esto:)

 3
Author: Pehmolelu,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2011-08-03 09:47:58

Intenta usar open evento de diálogo:

$( ".selector" ).dialog({
   open: function(event, ui) { ... }
});
 1
Author: Igor Dymov,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2011-08-03 08:34:17

Me pareció necesario utilizar el evento "focus:". Estaba perdiendo el botón correctamente seleccionado debido al espectáculo:. Interacciones encantadoras.

focus: function( event, ui ) {
    $(this).siblings('.ui-dialog-buttonpane').find("button:contains('Upload')").focus();
},
 0
Author: Chris Prince,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-08-18 19:04:31