4

I am trying to use jQuery.parseJSON to parse out the return value from an MVC3 controller action.

Controller:

    [HttpPost]
    public JsonResult LogOn(LogOnModel model, string returnUrl)
    {
        .. do stuff ..

        if (errors.Count() < 0)
        {
            return Json(new object[] { true, model, errors });

        }

        return Json(new object[] { false, model, errors });
    }

jQuery:

$.ajax({
                url: form.attr('action'),
                type: "POST",
                dataType: "json",
                data: form.serialize(),
                success: function (data) {
                    var test = jQuery.parseJSON(data);                      
                }   
            });

Json result from fiddler:

Content-Type: application/json; charset=utf-8

[false,{"UserName":"1","Password":"2","RememberMe":false},[{"Key":"","Errors":[{"Exception":null,"ErrorMessage":"The user name or password provided is incorrect."}]}]]

Fiddler can parse the results:

enter image description here

The call to jQuery.parseJSON is returning null. My questions is, how can I parse the json return value into an object?

Thanks!

2 Answers 2

6

You don't need to call parseJSON in your success handler, because ajax will have already parsed the JSON result (it does this automatically because you specified dataType:'json') into your array.

However, I'd recommend returning some sort of result object (whether you create an actual class in C# or use an anonymous type).

    [HttpPost]
    public JsonResult LogOn(LogOnModel model, string returnUrl)
    {
        .. do stuff ..

        if (errors.Count() < 0)
        {
            return Json(new { success=true, model, errors });

        }

        return Json(new { success=false, model, errors });
    }

and at the client

$.ajax({
                url: form.attr('action'),
                type: "POST",
                dataType: "json",
                data: form.serialize(),
                success: function (result) {
                    alert(result.success);
                    // also have result.model and result.errors                      
                }   
            });
Sign up to request clarification or add additional context in comments.

3 Comments

The jQuery.parseJSON call still returns null.
ah... you don't need to parseJSON because data will already be an object. ajax will attempt to parse the JSON result, because you specified type dataType as json. parseJSON expects a string and you're giving it an object, hence the null return. I didn't pay careful attention to your question, sorry. I'll revise.
I see; let me play with this a bit.
2

You are actually returning an array of objects and they shoould be accessed like this in the success function:

var booleanValue = data[0];

var yourModel = data[1];

var yourErrors = data[2];

I did give @HackedByChinese an up vote because naming the properties might be a better way to go about it in the end. Howvbere this will solve your immediate problem.

2 Comments

@rboarman hmmmm...this is the correct syntax for reading your JsonResult Json(new object[] { false, model, errors }) in your success method. Maybe there is a problem with the form. Why don't you try to change the $.ajax() call to a simple GET instead to work through the problem one step at a time.
@rboarman I've got a guess for you...does the form variable you are using in the $.ajax() call actually exist? Maybe you have a JS error you didn't notice. Can you make sure you have declared var form = $("form:first"); just before the $.ajax() call which gets the first form in the document.

Your Answer

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

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.