Ajax request sends url rather than data

Question

I have a very weird error running on my plugin. I am currently developing a plugin that will allow the user to create routes and specific dates for the route. The dates are more or less tickets that can be purchased by the visitor.

I am running ajax request for the data creation and removal of a date.

The return of these ajax requests are HTML snippets that are used to update the table that shows the available dates for the route.

When I create a route I get the proper HTML back and put it into the table via jQquery.

However, when I run pretty much the same request to delete a row from the table I do not get the same result back. Instead of getting the HTML back I am getting the URL back of my website. I have looked everywhere and cannot find anything why this could happen. The codex says, that in term of an error I get -1 or 0 back. The ajax request works fine and the row gets deleted just as I request.

I hope somebody could find the little devil who is preventing my code from being executed properly.

Here are the following files: PHP: witchroute/index.php witchroute/wit_witchroute.class.php witchroute/wit_date.class.php

HTML: witchroute/views/date-display.html witchroute/views/date-display-table.html witchroute/views/date-insert-form.html

What you should know: The ajax remove request is located in the wit_witchroute.class.php in the constructor

add_action('wp_ajax_remove_date_from_route', function()
                {
                    $wit_date = wit_date::getInstance();
                    $wit_date->removeDate($_POST);
                });

the actual method is in the wit_date.class.php

The jQuery request is started in the date-display.html with the following testing code:

jQuery(function() {
        jQuery(".witchroute_delete_btn").click(function(){

            var id      =   jQuery(this).attr('date-id');

            var deleteData  = { id: id,  
                                action: "remove_date_from_route",
                                security: '<?php print wp_create_nonce("adsfadsfasdfadsfd"); ?>'
                            };

            var r2 = jQuery.ajax({
                url: ajaxurl,
                type: "POST",
                data: deleteData,
                dataType: "html"
            });

            r2.done(function(msg) {
                //jQuery("#witchroute_date_display_body").html(msg);
                alert(msg);
            }); 
        });

    });

Please not, that I am fairly new to the plugin development. I havent done any form validation yet as I am still testing, so please dont comment on that. However, if you had some tips for structuring or so I would appreciate any help- that might even help solving my problem ?

I am looking forward to your help and hope somebody can see what I cannot see :)

All the best, Richard

Answer 1

Some Notes

1. You shouldn't use anonymous/lambda fn, closures for hooks - Those can't get unregistered.
2. Create your nonces, when localizing the script - See for ex. this answer.
3. The ajaxurl isn't set by default. You'll have to define it (and let it point to admin-ajax.php) when localizing the script. Then you access it via the localized object (the 2^nd argument inside wp_localize_script()) like this: your_obj_name.ajaxurl.

You should also take a look at the Codex article about Ajax in Plugins.