Mi problema es que no sé cómo adjuntar la callback al progtwig de diálogo jquery ui.
El espectáculo es en realidad una opción:
$( ".selector" ).dialog({ show: 'slide' });
Deseo recibir una callback una vez que se complete la animación de diapositivas. Miré desde los efectos en sí y tienen una callback:
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?
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 las versiones más recientes de jQuery.
Respuesta original
Ya respondí, pero ya que tenía una respuesta, la voy a publicar 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
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 callback complete
: una función no documentada.
He encontrado una solución actualizada, usando el objeto 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"); }); } });
Aquí está la demo habitual de JSFiddle: http://jsfiddle.net/losnir/jcmpm/
Descargué el paquete dev de jquery ui y descubrí que la callback está configurada con “completo”:
$( ".selector" ).dialog({ show: 'slide', complete: function() {} });
Gracias por ayudar a todos a resolver esto 🙂
Intenta usar open
evento open
de diálogo:
$( ".selector" ).dialog({ open: function(event, ui) { ... } });
Me pareció necesario usar el evento “focus:”. Estaba perdiendo el botón correctamente seleccionado por el espectáculo: Interacciones encantadoras
focus: function( event, ui ) { $(this).siblings('.ui-dialog-buttonpane').find("button:contains('Upload')").focus(); },