Skip to main content
AI Assist is now on Stack Overflow. Start a chat to get instant answers from across the network. Sign up to save and share your chats.

Return to Answer

added 1155 characters in body
Source Link
Pablo
Pablo
  • 401
  • 4
  • 7

EDIT: turns out that the wp standard jquery wasn't working properly, and the Google hosted jQuery included in another class was making the correct calls for the JS. When I removed the unregister/register added below, ALL the other dialog calls stopped working. I don't know why this happened, or the jQuery version included in this particular WP distribution, but when I returned to the old registrations, using Google hosted scripts as seen below, everything went back to normality.

On PHP (first, register and call the script):

add_action('admin_init', 'init_scripts_2'); function init_scripts_2(){ ///deregister the WP included jQuery and style for the dialog and add the libs from Google wp_deregister_script('jquery-ui'); wp_register_script('jquery-ui', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js');   wp_deregister_style('jquery-ui-pepper-grinder');  wp_register_style('jquery-ui-pepper-grinder', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/themes/pepper-grinder/jquery-ui.min.css'); wp_enqueue_script('jquery-ui'); ///call the wordpressrecently includedadded jquery wp_enqueue_style('jquery-ui-pepper-grinder'); ///call the recently added style wp_deregister_script('prevent_delete'); ///needed the deregister. why? don't know, but worked ///register again, localize and enqueue your script wp_register_script('prevent_delete', WP_PLUGIN_URL . '/custom_plugin/js/prevent_delete.js', array('jquery-ui')); wp_localize_script('prevent_delete', 'ajaxdelete', array('ajaxurl' => admin_url('admin-ajax.php'))); wp_enqueue_script('prevent_delete'); }

I didn't needed toEDIT: The call for the standard wp dialog style didn't work after all. The "pepper-grinder" style made the dialog appear correctly in the center of the window. I know the looks for the dialog are not very easy on the eye, but i needed the confirmation dialog and this worked just fine for me.

On PHP (first, register and call the script):

add_action('admin_init', 'init_scripts_2'); function init_scripts_2(){ wp_enqueue_script('jquery-ui'); ///call the wordpress included jquery wp_deregister_script('prevent_delete'); ///needed the deregister. why? don't know, but worked ///register again, localize and enqueue your script wp_register_script('prevent_delete', WP_PLUGIN_URL . '/custom_plugin/js/prevent_delete.js', array('jquery-ui')); wp_localize_script('prevent_delete', 'ajaxdelete', array('ajaxurl' => admin_url('admin-ajax.php'))); wp_enqueue_script('prevent_delete'); }

I didn't needed to call the standard wp dialog style. I know the looks for the dialog are not very easy on the eye, but i needed the confirmation dialog and this worked just fine for me.

EDIT: turns out that the wp standard jquery wasn't working properly, and the Google hosted jQuery included in another class was making the correct calls for the JS. When I removed the unregister/register added below, ALL the other dialog calls stopped working. I don't know why this happened, or the jQuery version included in this particular WP distribution, but when I returned to the old registrations, using Google hosted scripts as seen below, everything went back to normality.

On PHP (first, register and call the script):

add_action('admin_init', 'init_scripts_2'); function init_scripts_2(){ ///deregister the WP included jQuery and style for the dialog and add the libs from Google wp_deregister_script('jquery-ui'); wp_register_script('jquery-ui', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js');   wp_deregister_style('jquery-ui-pepper-grinder');  wp_register_style('jquery-ui-pepper-grinder', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/themes/pepper-grinder/jquery-ui.min.css'); wp_enqueue_script('jquery-ui'); ///call the recently added jquery wp_enqueue_style('jquery-ui-pepper-grinder'); ///call the recently added style wp_deregister_script('prevent_delete'); ///needed the deregister. why? don't know, but worked ///register again, localize and enqueue your script wp_register_script('prevent_delete', WP_PLUGIN_URL . '/custom_plugin/js/prevent_delete.js', array('jquery-ui')); wp_localize_script('prevent_delete', 'ajaxdelete', array('ajaxurl' => admin_url('admin-ajax.php'))); wp_enqueue_script('prevent_delete'); }

EDIT: The call for the standard wp dialog style didn't work after all. The "pepper-grinder" style made the dialog appear correctly in the center of the window. I know the looks for the dialog are not very easy on the eye, but i needed the confirmation dialog and this worked just fine for me.

added 5 characters in body
Source Link
Pablo
Pablo
  • 401
  • 4
  • 7
<a class="delete" href="?page=delete&action=delete">Delete<page=your_plugin&action=delete">Delete</a> 
<a class="delete" href="?page=delete&action=delete">Delete</a> 
<a class="delete" href="?page=your_plugin&action=delete">Delete</a>
Source Link
Pablo
Pablo
  • 401
  • 4
  • 7

I'm building a custom plugin on WP admin to insert data on custom MySQL tables. For nearly a week I was trying to do a confirmation dialog for a delete item event on a Wordpress table. After I almost lost all my hair searching for an answer, it seemed too good and simple to be true. But worked. Follows the code.

On PHP (first, register and call the script):

add_action('admin_init', 'init_scripts_2'); function init_scripts_2(){ wp_enqueue_script('jquery-ui'); ///call the wordpress included jquery wp_deregister_script('prevent_delete'); ///needed the deregister. why? don't know, but worked ///register again, localize and enqueue your script wp_register_script('prevent_delete', WP_PLUGIN_URL . '/custom_plugin/js/prevent_delete.js', array('jquery-ui')); wp_localize_script('prevent_delete', 'ajaxdelete', array('ajaxurl' => admin_url('admin-ajax.php'))); wp_enqueue_script('prevent_delete'); }

Next, if you're opening the dialog on a click event, like me, make sure you ALWAYS use class instead of id to identify the button or link later, on jQuery.

<a class="delete" href="?page=delete&action=delete">Delete</a>

We also need to use a tag that holds the dialog text. I needed to set the style to hide the div.

<div id="dialog_id" style="display: none;"> Are you sure about this? </div>

Finally, the jQuery.

/*jslint browser: true*/ /*global $, jQuery, alert*/ jQuery(document).ready(function ($) { "use strict"; ///on class click $(".delete").click(function (e) { e.preventDefault(); ///first, prevent the action var targetUrl = $(this).attr("href"); ///the original delete call ///construct the dialog $("#dialog_id").dialog({ autoOpen: false, title: 'Confirmation', modal: true, buttons: { "OK" : function () { ///if the user confirms, proceed with the original action window.location.href = targetUrl; }, "Cancel" : function () { ///otherwise, just close the dialog; the delete event was already interrupted $(this).dialog("close"); } } }); ///open the dialog window $("#dialog_id").dialog("open"); }); });

I didn't needed to call the standard wp dialog style. I know the looks for the dialog are not very easy on the eye, but i needed the confirmation dialog and this worked just fine for me.