Zeeshan Azim
Zeeshan Azim

Reputation: 11

how to access properties of json string

I have a JSON string coming from my database table but it has empty root element name

{"": [
  {"ID":18,"MenuName":"dsadasdasd","IsActive":"InActive"},
  {"ID":17,"MenuName":"Karachi","IsActive":"Active"},
  {"ID":2,"MenuName":"User Management","IsActive":"Active"},
  {"ID":1,"MenuName":"Home","IsActive":"Active"}
]}

I am trying to access this JSON with below jquery ajax call method

function Get_DataTable() {
    $.ajax({
        url: "GridView_JqueryFunctionality.aspx/CallDataTable_EmptyRootName",
        type: "POST",
        data: '{}',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (data) {
            alert(data.d) // showing json is fine
            var MyData = $.parseJSON(data.d);
            for (i = 0; i < Object.keys(MyData).length; i++) {
                alert(MyData[i].ID + ' : ' + MyData[i].MenuName);
            }
        }
    });
}

My Webmethod

[WebMethod(true)]
public static string CallDataTable_EmptyRootName(){    
    List<Category> Categories = new List<Category>();
    clsMenu objMenu = new clsMenu();
    DataTable dt = new DataTable();
    objMenu.GetAllMenu(dt);
    if (dt.Rows.Count > 0){
        string jsonString = ConversionExtension.DataTabelToJson(dt);            
        return jsonString.ToString();           
    }else{
        return "";
    }
}

it is giving me undefined : undefined... Please help me. I am stuck now

Upvotes: 0

Views: 410

Answers (3)

boruchsiper
boruchsiper

Reputation: 2028

Try this:

function Get_DataTable() {
    $.ajax({
        url: "GridView_JqueryFunctionality.aspx/CallDataTable_EmptyRootName",
        type: "POST",
        data: '{}',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (data) {
            alert(data.d) // showing json is fine
            var MyData = $.parseJSON(data.d)[""];

            for (i = 0; i < MyData.length; i++) {
                alert(MyData[i].ID + ' : ' + MyData[i].MenuName);
            }
        }
    });
}

Upvotes: 1

jherax
jherax

Reputation: 5267

You have to access with brackets the no-name property in the root object, and then iterate over the array of items.

success: function(response) {
  var data = $.parseJSON(response.d);
  var list = data[""];
  list.forEach(function(item, i) {
    console.log(item);
    console.log(item.ID, ' -> ', item.MenuName);
  });
}

Upvotes: 1

Joseph Cho
Joseph Cho

Reputation: 4214

Assuming you have a variable name for your object, you can reference it with an empty string as the key.

var a = {
  "": [
    {
      "ID": 18,
      "MenuName": "dsadasdasd",
      "IsActive": "InActive"
    },
    {
      "ID": 17,
      "MenuName": "Karachi",
      "IsActive": "Active"
    },
    {
      "ID": 2,
      "MenuName": "User Management",
      "IsActive": "Active"
    },
    {
      "ID": 1,
      "MenuName": "Home",
      "IsActive": "Active"
    }
  ]
}
console.log(a[""]);

Try running the above code notice we can still access the objects elements despite having an empty root name.

Upvotes: 1

Related Questions