¿Cómo vuelvo a enlazar el evento después de guardar el widget?

Question

¿Cómo vuelvo a enlazar el evento después de guardar el widget?

#1 de Sergey Arefiev (6 votos)
#2 de Lea Cohen (0 votos)
#3 de Adeel (0 votos)

4

Estoy escribiendo un widget cuyos elementos de formulario tienen un evento de clic adjunto. Lo ato usando jQuery.

Sin embargo, después de hacer clic en save , los enlaces se pierden. Es decir, al hacer clic en esos elementos ya no se activa la función.

Intenté usar el método on() jQuery, como se sugiere aquí , pero eso no ayuda:

    var buttonsHolder=jQuery('#widgets-right .icon_buttons');            
    // save the array of big icons, for later reference, and assign them the click event
    var  buttons=buttonsHolder.children('input');
    buttons.on("click",function(){
        openPanel(jQuery(this),jQuery(this).index());
    });

Podría poner mi código js dentro del formulario del widget, como se sugiere aquí . Eso resuelve el problema, pero realmente prefiero mantener mi código js separado.

¿Qué debo hacer para mantener funcionando el evento de clic de esos elementos incluso después de hacer clic en el botón save ?

jquery widgets

pregunta Lea Cohen 19.03.2013 - 13:53

3 respuestas

6

Wordpress proporciona devoluciones de llamada para interacciones de widgets. Parece que estás interesado en dos de ellos:

agregado de widget, actualizado de widget

Ejemplo de uso:

jQuery(document).on('widget-updated', function(e, widget){
    // do your awesome stuff here
    // "widget" represents jQuery object of the affected widget's DOM element
});

respondido por el Sergey Arefiev 20.11.2014 - 13:31

0

Agregué su código y lo solucioné para actualizar el widget, es decir, al actualizar el widget, todas las opciones funcionan bien. Pero ahora que agrego un nuevo widget, no funciona bien hasta que actualice la página o presione Guardar una vez.

Estoy tratando de corregir el siguiente código en mi proyecto:

$( document ).on( 'widget-updated' , function( event, $widget ){
    $('.of-color').wpColorPicker();
    $('.selectpicker').selectpicker();
});

También lo intenté así

$( document ).on( 'widget-updated widget-added' , function( event, $widget ){
    $('.of-color').wpColorPicker();
    $('.selectpicker').selectpicker();
});

Pero todavía no funcionaba para el nuevo widget agregado. Por favor ayuda para solucionar este problema.

Gracias.

respondido por el Adeel 08.05.2015 - 01:47

Lea otras preguntas en las etiquetas jquery widgets

API externa de WordPress ¿Cómo puedo poner una matriz como variable en shortcode_atts?

score 0 · Accepted Answer

Debido a que el cuadro de entrada se está reconstruyendo (o todo el formulario), seguí los consejos que me dieron en otro lugar y, en lugar de vincular () a un cuadro de entrada, lo vinculo más arriba y uso la delegación de eventos:

jQuery('#widgets-right').on('click','.icon_buttons input',function(){
     openPanel(jQuery(this),jQuery(this).index());
});

Todavía coloco algunas declaraciones de variables js dentro del formulario del widget, pero eso es solo por conveniencia, y solo son unas pocas líneas de código, así que no me importa demasiado.