JSON.parse not parsing Json string. Serializing with JavaScriptSerializer

Question

I have a serialized string comming from the controller to a view:

Controller:

var serialize = new JavaScriptSerializer();
return Json(new
{
data = serialize.Serialize(obj)
}, JsonRequestBehavior.AllowGet);

Json string:

[{"indiceName":"Caracter","indiciId":24,"indiceId":1,"tamanhoIndice":10,"mask":null,"indiceObr":1},

{"indiceName":"Numérico","indiciId":25,"indiceId":2,"tamanhoIndice":10,"mask":null,"indiceObr":0},

{"indiceName":"AlfaNumérico","indiciId":26,"indiceId":3,"tamanhoIndice":10,"mask":null,"indiceObr":0}]

As far as I know, modern browser should be able to parse that string with a simple Json.parse()

View:

success: function (data) 
         {
            $('.dinamic').remove();
            console.log(data);
            var obj2 = JSON.parse(data);
            console.log(obj2);
         }

I am able to see that string in the first console.log, but I get nothing from the second. Is there any thing else I should be looking at because all the post I have read people only do it as simple as it is with a single JSON.parse. I am using latest version of google chrome ,firefox and IE so it should work.

Answer 1

Although your success function is not shown in context of the other AJAX options being given, I would guess you are passing a dataType option of "json", or are using $.getJSON or something similar.

If that is the case, jQuery has already parsed the JSON for you by the time it passes it into success so you do not need to (and cannot) parse it again. You can simply use your data structure ( data[0]. indiceName and etc).

(The below code is running live at http://jaaulde.com/test_bed/GuilhermeLongo/ )

Consider the following PHP (stored in json.php ):

<?php
exit('[{"indiceName":"Caracter","indiciId":24,"indiceId":1,"tamanhoIndice":10,"mask":null,"indiceObr":1},{"indiceName":"Numérico","indiciId":25,"indiceId":2,"tamanhoIndice":10,"mask":null,"indiceObr":0},{"indiceName":"AlfaNumérico","indiciId":26,"indiceId":3,"tamanhoIndice":10,"mask":null,"indiceObr":0}]');

And the following JS:

<script src="http://code.jquery.com/jquery.min.js"></script>
<script>
  $.ajax({
    url: 'json.php',
    type: 'get',
    dataType: 'json',
    success: function (data) {
      console.log(data[0]);
      console.log(data[0].indiceName);
    },
    error: function () {
      throw new Error('AJAX request error occurred.');
    }
  });
</script>

It results in the following outputted log info:

GET http://jaaulde.com/test_bed/GuilhermeLongo/json.php
    200 OK
    99ms    
    jquery.min.js (line 3)

Object
    {indiceName="Caracter", indiciId=24, indiceId=1, more...}/test_...eLongo/
    (line 8)

Caracter