Ajax with OOP doesn't work

All we need is an easy explanation of the problem, so here it is.

I have a small script within theme’s functions.php file that uses ajax, principle like this:

add_action('admin_head', 'rw_script');
function rw_script() {
    echo '
    <script type="text/javascript">
        // delete image
        $(".delete_image").click(function(){
            var data = $(this).attr("rel");
            $.post(
                ajaxurl,
                {action: \'rw_delete_image\', data: data}, function(response){
                    alert(response); // debug
                }
            );

            return false;
        });
    });
    </script>';
}
function delete_image() {
    if (isset($_POST['attach_id'])) wp_delete_attachment($_POST['attach_id']);
        die();
}
add_action('wp_ajax_rw_delete_image', 'delete_image');

It works fine. But when I turned it into OOP, the ajax doens’t work:

class RW_Test {
    function __construct() {
        add_action('admin_head', array(&$this, 'rw_script'));
        add_action('wp_ajax_rw_delete_image', array(&$this, 'delete_image'));
    }
    function rw_script() {
        echo '
        <script type="text/javascript">
            // delete image
            $(".delete_image").click(function(){
                var data = $(this).attr("rel");
                $.post(
                    ajaxurl,
                    {action: \'rw_delete_image\', data: data}, function(response){
                        alert(response); // debug
                    }
                );

                return false;
            });
        });
        </script>';
    }
    function delete_image() {
        if (isset($_POST['attach_id'])) wp_delete_attachment($_POST['attach_id']);
            die();
    }
}

The javascript works fine, i.e when I click on delete links, data is sent properly. But the action for deleting image isn’t fired.

Do you know how to solve this? Please help me. Thank you.

How to solve :

I know you bored from this bug, So we are here to help you! Take a deep breath and look at the explanation of your problem. We have many solutions to this problem, But we recommend you to use the first method because it is tested & true method that will 100% work for you.

Method 1

You need to create a new instance of the class so that your constructor is called and your actions are registered. e.g. you need to add something like $test = new PR_Test; below the definition of PR_Test.

Method 2

It should work; I’ve done the exact same thing successfully in a couple different styles of custom post type classes. There’s a possibility that your original RW_Test object is being overwritten—perhaps you’re using the same variable name somewhere else?

At any rate, a good place to start troubleshooting is to look at all the active hooks to make sure that your “wp_ajax_rw_delete_image” action is active (and paired with the correct RW_Test object) when you initiate the AJAX call. I suggest this hooks debugger from Rarst to echo the active hooks in your admin page.

Method 3

It’s been a long time since this question, now my code has changed a lot. But after re-look at the code, and I think the request should be:

$.post(
    ajaxurl,
    {action: 'rw_delete_image', attach_id: data}, function(response){
         alert(response); // debug
    }
);

not {action: 'rw_delete_image', data: data}.

Note: Use and implement method 1 because this method fully tested our system.
Thank you 🙂

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply