2

From my custom table ($table = $wpdb->prefix . 'user_req';) I'm showing data with $wpdb->get_results() and a foreach loop:

my table

I managed to update the database with the individual values from the form where there is a "Submit" button. But, from this table I want to delete any of the row by clicking on the (x) button on the right of each row. I can use $_GET[] and can easily delete the row, but in this case I want to use AJAX.

The (x) button on the right of each of the row is actually:

<input type="button" class="delete" title="Exclude This One"/>

I'm not a code-background, so I'm actually struggling with it. Most of the solution comes when I search, are for raw PHP-mySQL, but I'm trying to deal it with a WordPress way. I could prepare my $wpdb delete query:

<?php $wpdb->delete( $table, array( 'post_id' => $products->post_id ) ); ?>

But couldn't manage to go with it in an WordPress-AJAX way. Therefore, any help would be greatly appreciated.

4

Nonce

You are going to want to set a nonce hidden field or to the element so that you can verify the request. Take a look at the codex for examples.

Setting the POST ID and Nonce

You will need to add the id of the specific post to the delete button or to a hidden input field associated with that entry. I have the example setup so you will need to add the post_id and the nonce to the element id in a format such as #delete_postid_nonce. Your element ID would need to end up like so: #delete_12_94f3a1e666.

You could assign it using: $element_id = 'delete_' . $products->post_id . '_' . wp_create_nonce('delete_' . $products->post_id );

Add Actions

These need to be placed in functions.php or in a custom plugin.

You will notice there are two add_action calls. One is for privileged users (i.e. they are logged in) and one is for non-privileged users. Remove one or the other if you don't need both. You can read more about that on the Codex.

Delete_Row() Function

This need to be placed in functions.php or in a custom plugin.

Here you are grabbing the id that we we sent in the data object of the ajax call. That gets parsed and put in the the POST array since the type of the ajax call is set to POST.

Then you explode() the ID out of the element id sent in the ajax call (e.g. '#delete_12_94f3a1e666') which would leave you with $id = array('delete', 12, '94f3a1e666');. So the post_id is equal to index [1].

Then you echo to return data to the success portion of the ajax call. And then you kill the php function by calling `die'.


You will need to modify this code to make it work 100%.

JS:

jQuery(document).on('click', '.delete', function () {
    var id = this.id;
    jQuery.ajax({
        type: 'POST',
        url: ajaxurl,
        data: {"action": "your_delete_action", "element_id": id},
        success: function (data) {
            //run stuff on success here.  You can use `data` var in the 
           //return so you could post a message.  
        }
    });
});

PHP:

function delete_row() {
    $id = explode('_', sanitize_text($_POST['element_id']));
    if (wp_verify_nonce($id[2], $id[0] . '_' . $id[1])) {
                $table = 'yourtable';
        $wpdb->delete( $table, array( 'post_id' => $id[1] ) );

        echo 'Deleted post';
        die;
    } else {
        echo 'Nonce not verified';
        die;
    }

}

add_action('wp_ajax_your_delete_action', 'delete_row');
add_action( 'wp_ajax_nopriv_your_delete_action', 'delete_row');
  • Thank you sooo much for the details answer. But, I'm afraid, I can't understand the if( wp_verify_nonce( $id[2], $id[0] . '_' . $id[1] ) ) portion. Can't match this portion with other tutorials (like this one). And with no changes to your code, if I run my page it's throwing a fatal error on the second product - showing: Can't redeclare function delete_row(). I pasted both the function and <script>jQuery(document).on... inside the loop. – Mayeenul Islam Feb 24 '14 at 16:12
  • They are doing it a different way on that tutorial. Perfectly valid way. When you explode the string delete_12_94f3a1e666 you come up with delete at array index [0], 12 for array index [1], 94f3a1e666 for array index [2]. If you look at the function reference, the first param of wp_verify_nonce is the nonce then the nonce_name. I am checking the nonce in the if statement. delete_row(): it seems that there is another function named delete_row() on your install. Rename this one. You don't want the function inside the loop. In your functions.php file or a custom plugin. – CommandZ Feb 24 '14 at 16:46
  • When you change the function name you will need to rename it in the add_actions as well. This code is not copy/pasteable. I do not know your complete setup. You need to modify it to your specific setup. For example: in the delete_row() function you need to properly setup $wpdb->delete() because it will not work as is. – CommandZ Feb 24 '14 at 16:52
  • Can you be on the loop for a chat with me? – Mayeenul Islam Feb 24 '14 at 16:56
  • @Mayeenul Islam: What questions do you have at this point? I can point you to appropriate resources. You are very close to making this work. Make sure you have the debug bar plugin installed! Also use the javascript console in your browser to debug the javascript! – CommandZ Feb 24 '14 at 17:00

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.