Run JS after widget settings are saved?

Question

I've written a small widget that uses JS for setting up some tabs in the settings panel. Is there a way to re-trigger the tab JS when the widget is done saving?

Looking at the WP JS source it doesn't look like it, as it simply blows away the existing HTML & re-renders the entire form. I could potentially overwrite wpWidgets.save & do something nutty there but that seems really drastic.

Solution

After some hacking based upon One Trick Pony's idea, here's what I ended up with.

<script>
jQuery(document).ready(function($){
    if(parseInt("<?php echo $this->number; ?>", 10)) {
        $("[id$='<?php echo $this->id; ?>'] .tabs").tabs();
    }
});
</script>

Basically I just send down some JS w/ some Widgets values hardcoded in & do some checks & fun CSS3 selectors to find the right DOM nodes.

Answer 1

Put your javascript code inside the widget form, and it will be triggered whenever the widget is refreshed.

If you're tabs are hooked on a click event, a better way would be to use $.delegate on the widget instance wrapper. That way you don't need to include the js inside every widget instance...

Answer 2

This is an old thread, but in case someone else winds up here:

There are js actions triggered when widgets are added or saved. Reasonably called widget-added and widget-updated.

Trac ticket: https://core.trac.wordpress.org/ticket/19675

You can use them like so:

    // On the Widget Actions, run.
$( document ).on( { 'widget-added widget-updated': function ( e, widget ) { //do stuff. }