Deserialize JSON with JavaScriptSerializer

Question

I create a navigation tree and maintain the structure using this function in an array

function parseTree(html) { var nodes = []; html.parent().children("div").each(function () { var subtree = $(this).children("div"); var item = $(this).find(">span"); if (subtree.size() > 0) nodes.push([item.attr("data-pId"), item.attr("data-id"), parseTree(subtree)]); else nodes.push(item.attr("data-pId"), item.attr("data-id")); }); return nodes; } 

Then i serialize the data

 var tree = $.toJSON(parseTree($("#MyTree").children("div"))); 

Get this array

 [ ["881150024","881150024", [ "994441819","881150024", "214494418","881150024" ] ], ["-256163399","-256163399", [ "977082012","-256163399", "-492694206","-256163399", [ "1706814966","-256163399", ["-26481618","-256163399"] ] ] ] ] 

And send it using ajax

  $.ajax({ url: "Editor/SerializeTree", type: "POST", data: { tree: tree }, success: function (result) { alert("OK"); } }); 

Question: How to remove this JSON handle using JavaScriptSerializer in C #?

Answer 1

Here it seems that you have an array of nodes, and each node has a rowset or another array of nodes, doesn't it? The first thing you could do is simply deserialize this to a List<object> as follows:

 string treeData = "..."; // The JSON data from the POST JavaScriptSerializer js = new JavaScriptSerializer(); List<object> tree = js.Deserialize <List<object>>(treeData); 

This will turn your JSON into a list of objects, although you will need to manually find out what is (if each object is a string or a different List<object> ).

This usually helps to have some kind of class or structure to represent the "schema" for the data that you pass to the serializer, but this is a little more than the above.

In this case, you need your input as an actual JSON object, not just an array. Let's say you have this JSON (based on the above data):

 {id: "root", children: [ {id: "881150024"}, {id: "881150024", children: [ {id: "994441819"}, {id: "881150024"}]}, {id: "-256163399"}, {id: "-256163399", children: [ {id: "-492694206"}, {id: "-256163399", children: [ {id: "1706814966"}, {id: "-256163399", children: [ {id: "-26481618"}, {id: "-256163399"}]} ]}]}]} 

If you have a class like this:

 public class Node { public String id; public List<Node> children; } 

Then you can do something like:

 string treeData = "..."; // The JSON data from the POST JavaScriptSerializer js = new JavaScriptSerializer(); Node root = js.Deserialize<Node>(treeData); 

The code will be much easier to work with.

Answer 2

Given the answer of @_rusty.

In MVC3, you can group JSON data into actions, so your controller code will be very simple.

 [HttpPost] public void SerializeTree(IList<Node> tree) { // tree is deserialized JSON here } 

Answer 3

For those rare people who still use VB.Net here and there:

 Imports System.Web.Script.Serialization 'wsvcResponse<string> contains the following JSON object: { "foo":"bar", "foo2": { "bar2": "foobar" } } Dim jsSerializer As New JavaScriptSerializer() Dim jsonObject As List(Of Object) = jsSerializer.Deserialize(Of Object)(wsvcResponse) Dim foo As String = jsonObject("foo").ToString ' "bar" Dim bar2 As String = jsonObject("foo2")("bar2").ToString ' "foobar"