jQuery AJAX page refresh to show changes, followed by message feedback

admin

Administrator
Staff member
I have a Wordpress Lists Table, and each row has the option to be deleted. When clicking
Code:
<a class="delete_gallery" href="&action=delete">
I have a jQueryUI Dialog pop up. When confirming the action, ajax happens or whatever, and some server side stuff is processed. On success, I want the page to refresh and a wordpress message to be displayed, explaining that the delete was successful.

The reason I want the page to refresh is because my WP_List_Table isn't ajaxified, and I need the change to be seen.

How do I display a message after the page is refreshed? The way I currently have shows the message right after the refresh is called. I don't want delays or anything: as soon as the confirmation in the dialog is clicked, I want the page to refresh, the server side stuff to happen, and then the success message to display.

Here is some of my code, with the server side var/info removed for simplicity. Note: I'm using Wordpress's built in Ajax.

Code:
jQuery(".delete_gallery").click(function(event) {

    event.preventDefault();     
var link = jQuery(this).attr('href');
var link = link.substring(0, link.indexOf('?'));

jQuery("#deleteconf").dialog({
  height: 150,
  width: 350,
  resizable : false,
  modal: true,
  buttons: {
      "Delete all items": function() {
     jQuery(this).dialog("close");
        jQuery.post(
        MyAjax.ajaxurl,
        {
        action : 'delete_gallery',
        postCommentNonce : MyAjax.postCommentNonce,
        },
    function(response) {
        window.location.reload(link);   
        jQuery('#message p').html('The gallery was deleted successfully');
        jQuery('#message').show();      
    }); return false;

    },
    Cancel: function() {
    jQuery(this).dialog("close"); return false;
    }
}
}); 

});

Is this the best way to do it? If so, how do I get the message to show up after the refresh. If not, whats the best way? I would really like to use jQueryUI and I don't want someone to have to click like "okay, item was deleted" for the page to refresh and show the change.

I have something similar to this in place, but it uses a form and php to capture the button submit $_POST, and I'm not sure if that's possible when using jQueryUI Buttons. Either way, it doesn't tackle the response after the refresh.

Thanks, and I appreciate all help.