AJAX using jQuery - Syntax Error?

Question

The following is the HTML containing the call to the JavaScript function responsible for issuing the AJAX call. I understand that anchor tags are not supposed to have a value attribute but I'm using it with jQuery's .attr("value") method.

<a href="javascript:;" onclick="ajaxTest();" title="Execute AJAX" value="executeAJAX">Execute AJAX</a>

The following is the JavaScript function. If it is of any significance, it is contained in a .js file all by itself.

function ajaxTest() {
    $.ajax({
        type: "POST",
        url: "doAJAX",
        data: {"selectedScope": "5",
               "selectedView": "6"},
        dataType: "text",
        success: function(responseData) {
            $("#replaceThis").append(responseData);
        }
    });
}

Everytime the link is clicked, a "syntax error" message appears in Firefox's web console. The JavaScript seems to be working as intended, however.

I just want to understand why I am getting the error.

I should add that I'm using jQuery 1.7.1.

I've performed a search and the only resolution I've found was that the keys for the "data" option should be enclosed in double quotes so I've implemented that but I'm still getting the syntax.

Thanks.

EDIT:

Looking at the Firebug console, the code above doesn't trigger an error like it did in Firefox's console, however, I saw the following in the XML part of the POST Request:

XML Parsing Error: syntax error Location: moz-nullprincipal:{1d13df07-25fb-4058-9f82-ce1bef3c8949} Line Number 1, Column 1:
alskdfjlaksjdfjasdfl
^

The "alskdfjlaksjdfjasdfl" is simply what I've set up my servlet to return as I test this stuff out.

This is somewhat weird because it seems like jQuery is trying to parse the response as XML although I've explicitly stated it to be text.

Answer 1

I recently encountered the same issue. jQuery appeared to be handling the data and the dataType correctly, but instead it was Firefox returning the syntax error, which explains why your code was executing as intended but still printing an error to the console.

If you look in the developer console, you can see that Firefox is interpreting the plain text data as another format (likely XML). Firefox tires to parse the data as XML, but can't because it's not valid XML which results in "Syntax error" being printed to the console.

The resolution to this problem for me was editing the server so it returned the below header:

Content-Type: "text/plain"

This only appeared to be an issue with Firefox, Chrome did not encounter this issue. There is a Firefox bug here which seems to touch on the issue.

Answer 2

function ajaxTest() {
    $.ajax({
        type: "POST",
        url: "doAJAX",
        data: {"selectedScope": "5",
               "selectedView": "6"          <---- here (drop comma, add bracket)
               },
        dataType: "text",
        success: function(responseData) {
            $("#replaceThis").append(responseData);
        }
    });
}