8

I'm using the following Ajax call to load a partial view into a div:

  $.ajax({
    url: "/URL",
    type: "POST",
    dataType: "json",
    data: JSON.stringify(request),
    contentType: "application/json; charset=utf-8",
    success: function(data) {
        $('#Result').html(data);
        App.hidePleaseWait();
    },
    error: function (jqXHR, textStatus, errorThrown) {
        App.hidePleaseWait();
        alert(textStatus);
        alert(errorThrown);
    }
});

Here's my controller:

[HttpPost]
        public ActionResult GetSomething(MyModel formModel)
        {
            var model = new ResultModel();

            try
            {
                model.Data = GetSomeData();
            }
            catch (Exception exception)
            {
                model.ErrorMessage = exception.Message;
            }

            return PartialView("_Results", model);
        }

I get the following error "parserrror SyntaxError: Unexpected token <"

It seems that the .ajax call is expecting json back instead of html. What do I need to do to fix this?

Thanks.

PSL
  • 123,204
  • 21
  • 253
  • 243
Mike
  • 2,561
  • 7
  • 34
  • 56
  • that error means you're requesting json, but the server is returning HTML. either make the server return JSON, or make the ajax expect text or html. – Kevin B Sep 18 '13 at 21:33

2 Answers2

33

You need to change your datatype in the ajax call.

 dataType: "json",

to

 dataType: "html", 

Datatype tells that type is json, but you send back the partial view which is html. So it tries to parse it as json data and throws the error.

datatype - type of data you expect back from the server.

dataType (default: Intelligent Guess (xml, json, script, or html)) Type: String The type of data that you're expecting back from the server. If none is specified, jQuery will try to infer it based on the MIME type of the response (an XML MIME type will yield XML, in 1.4 JSON will yield a JavaScript object, in 1.4 script will execute the script, and anything else will be returned as a string). The available types (and the result passed as the first argument to your success callback) are:

PSL
  • 123,204
  • 21
  • 253
  • 243
  • I had to change it to text instead of text/html. It was throwing an error of no conversion from text to text/html. Thanks! – Mike Sep 18 '13 at 21:36
  • @Mike change it to `html` – PSL Sep 18 '13 at 21:37
  • Thanks... I have a question as an extension to this - http://stackoverflow.com/questions/24175081/how-to-force-datatype-as-json-in-asp-net-2-0 – LCJ Jun 12 '14 at 01:17
1

As you now know to add dataType to html instead of json. I also check for the following in the success/done part of jquery's ajax function:

success: function (response, status, xhr) {
  var ct = xhr.getResponseHeader("content-type") || "";
  if (ct.indexOf('html') > -1) {
    // returned result is of type html, so act accordingly
    }
  else if (ct.indexOf('json') > -1) {
    // returned result is of type json, so act accordingly
  }
}

Also, there are times when you might need to parse the data you have received from server as html like this:

var htmldata = $.parseHTML(data); //where data is the stuff you got from server. and now use this htmldata for your processing.

Reference for parseHTML()

KKS
  • 3,600
  • 1
  • 27
  • 54
  • @Mike the above stuff that I have mentioned can help you in ways if your controller return a view with validation msgs i.e. html or json if all goes well. – KKS Sep 18 '13 at 21:53