How to parse an array from a JSON string?

Question

I have the following C# method:

[HttpPost]
public JsonResult GetDateBasedRegex(string date)
{
    string[] arr = CommonMethods.GetDateBasedRegex(date);

    JsonResult retVal = Json(JsonConvert.SerializeObject(retVal));

    return retVal;
}

arr contains the following:

And retVal.Data contains this value:

That C# method is invoked by this JS:

var date = $('#myDateField').val();

AjaxRequest(date, 'html', 'post', '/Common/GetDateBasedRegex', 'application/json;', function (response)
{
    var result = JSON.parse(response);
} 
);

I've set a breakpoint and added a watch for both response and result :

response is slightly longer because it escapes the quotes but otherwise they're the same value.

Both variables are a single string. How can I parse this value into an array? I looked at a variety of "suggested questions" by SO when typing this question, the most relevant one seems to be this: Javascript how to parse JSON array but I'm already doing what the selected answer suggests.

I tried making a JS fiddle: http://jsfiddle.net/zc2o6v52/ but due to the quotes added by the debugger I had to tweak the values slightly in order to get it to work. If I use the variable csharpJsonSerializedString or result the loop works but when I use response I get an "Uncaught SyntaxError: Unexpected string" error in my console.

What am I doing wrong? How do you parse an array from a JSON string?

EDIT

C# retval 's value:

"[\\"^[0-9]{9}[A-Z0-9]{0,3}$\\",\\"^[AZ]{1,3}([0-9]{6}|[0-9]{9})$\\"]"

JS response 's value:

""[\\"^[0-9]{9}[A-Z0-9]{0,3}$\\",\\"^[AZ]{1,3}([0-9]{6}|[0-9]{9})$\\"]""

JS result 's value:

"["^[0-9]{9}[A-Z0-9]{0,3}$","^[AZ]{1,3}([0-9]{6}|[0-9]{9})$"]"

Grabbed all of these by right click -> Copy value, so they include the 'wrapping' set of quotes to make it a string.

The C# looks like it's formed right for how one would define a JS array. It seems like response is wrapped with an extra set of quotes though?

I also tried changing my JS to define var result = ['','']; outside of the ajax call, then to update its value with JSON.parse() but it still remains a single string afterwards.

Answer 1

Assuming this is the exact value your API returns on the POST request

"[\"^[0-9]{9}[A-Z0-9]{0,3}$\",\"^[A-Z]{1,3}([0-9]{6}|[0-9]{9‌​})$\"]"

This is no json, so JSON.parse can't work. Your JSON should look like this:

[
"^[0-9]{9}[A-Z0-9]{0,3}$",
"^[A-Z]{1,3}([0-9]{6}|[0-9]{9‌​})$"
]

The best way would be to fix the backend to return the right value ( this might point you in the right direction). Otherwise, you need to get rid of the quotation marks at the beginning and end which are added to your result variable:

var result = "\"[\"^[0-9]{9}[A-Z0-9]{0,3}$\",\"^[A-Z]{1,3}([0-9]{6}|[0-9]{9‌​})$\"]\"";
result = result.substring(1, result.length-1);
var jsonData = JSON.parse(result);
for (var i = 0; i < jsonData.length; i++) {
    console.log(jsonData[i]);
}

If that doesn't work, check how your response data in the ajax function differs from the valid json mentioned above.