Ajax request returns 200 OK, but an error event is fired instead of success
jQuery.ajax
attempts to convert the response body depending on the specified dataType
parameter or the Content-Type
header sent by the server. If the conversion fails (e.g. if the JSON/XML is invalid), the error callback is fired.
Your AJAX code contains:
dataType: "json"
In this case jQuery:
Evaluates the response as JSON and returns a JavaScript object. […] The JSON data is parsed in a strict manner; any malformed JSON is rejected and a parse error is thrown. […] an empty response is also rejected; the server should return a response of null or {} instead.
Your server-side code returns HTML snippet with 200 OK
status. jQuery was expecting valid JSON and therefore fires the error callback complaining about parseerror
.
The solution is to remove the dataType
parameter from your jQuery code and make the server-side code return:
Content-Type: application/javascriptalert("Record Deleted");
But I would rather suggest returning a JSON response and display the message inside the success callback:
Content-Type: application/json{"message": "Record deleted"}
You simply have to remove the dataType: "json" in your AJAX call
$.ajax({ type: 'POST', url: 'Jqueryoperation.aspx?Operation=DeleteRow', contentType: 'application/json; charset=utf-8', data: json, dataType: 'json', //**** REMOVE THIS LINE ****// cache: false, success: AjaxSucceeded, error: AjaxFailed});
I've had some good luck with using multiple, space-separated dataType
s (jQuery 1.5+). As in:
$.ajax({ type: 'POST', url: 'Jqueryoperation.aspx?Operation=DeleteRow', contentType: 'application/json; charset=utf-8', data: json, dataType: 'text json', cache: false, success: AjaxSucceeded, error: AjaxFailed});