0

I am trying to do a pretty basic AJAX request at the moment, just to test functionality, routing my calls through admin-ajax.php. However, every time I try to fire the AJAX request, I get a 404 error that says "Uncaught syntaxerror: Unexpected token <". Wtf? It appears to be doing this because of the carot in my DTD... I've been through my code but can't figure out what I'm doing wrong here...I'm fairly new to working with AJAX so any help would be appreciated.

The php in functions.php is nothing...

function shows_callback(){
    echo '<h1>Test</h1>';
}

The ajax call...

    $(".tabs .btn").click(function(e) {
        e.preventDefault();
        $.ajax({
            url:"/wp-admin/admin-ajax.php",
            type: "GET",
            dataType: "html",
            cache: false,
            data: {
                action: "shows"
        },
            success: function(resp) {
                $(".ajax-show").append(resp);

            },
            error: function(xhr, status, error){
                var err = JSON.parse(xhr.responseText);
                console.log(err);
            }
        });
    });

What could I be doing wrong here?

EDIT: The full error:

Uncaught SyntaxError: Unexpected token <

Which I figure is related to the dataType, but I've declared html, so I don't understand...

3
  • Please copy and paste the entire, unedited error/warning as an edit to the question.
    – s_ha_dum
    Apr 29, 2015 at 18:12
  • Does the error say anything about the file and/or line number where the error is occuring? Apr 29, 2015 at 18:29
  • Line one of my index file...the "<" is coming from the DTD of my file. the <!DOCTYPE html>
    – la1ch3
    Apr 29, 2015 at 18:32

2 Answers 2

1

success and error are functions, not properties of AJAX function. Working code:

$(".tabs .btn").click(function(e) {
    e.preventDefault();
    $.ajax({
        url:"/wp-admin/admin-ajax.php",
        type: "GET",
        dataType: "html",
        cache: false,
        data: {
            action: "shows"
        }
    })
    .success(function(resp) {
        $(".ajax-show").append(resp);
    })
    .error(function(xhr, status, error) {
        var err = JSON.parse(xhr.responseText);
        console.log(err);
    });
}); 

Also that should be noted:

Deprecation Notice: The jqXHR.success(), jqXHR.error(), and jqXHR.complete() callbacks are removed as of jQuery 3.0. You can use jqXHR.done(), jqXHR.fail(), and jqXHR.always() instead.

0

Make sure you set your

define( 'WP_DEBUG', false );

Else the notices and possible errors may cause 404.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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