Jquery与多级json数据数组

时间:2013-10-22 15:50:32

标签: jquery json jqxgrid

[
  {
    "Address": {
      "Address": "4 Selby Road\nHowden",
      "AddressId": "1414449",
      "AddressLine1": "4 Selby Road",
      "AddressLine2": "Howden",
      "ContactId": "14248844",
      "County": "North Humberside",
      "Country": "UK",
      "Postcode": "DN14 7JW",
      "Town": "GOOLE",
      "FullAddress": "4 Selby Road\nHowden\r\nGOOLE\r\nNorth Humberside\r\nDN14 7JW\r\nUnited Kingdom"
    },
    "ContactId": 14248844,
    "Title": "Mrs",
    "FirstName": "",
    "Surname": "Neild",
    "FullName": " Neild",
    "PostCode": "DN14 7JW"
  },
  {
    "Address": {
      "Address": "466 Manchester Road\nBlackrod",
      "AddressId": "1669615",
      "AddressLine1": "466 Manchester Road",
      "AddressLine2": "Blackrod",
      "ContactId": "16721687",
      "County": "",
      "Country": "UK",
      "Postcode": "BL6 5SU",
      "Town": "BOLTON",
      "FullAddress": "466 Manchester Road\nBlackrod\r\nBOLTON\r\nBL6 5SU\r\nUnited Kingdom"
    },
    "ContactId": 16721687,
    "Title": "Miss",
    "FirstName": "Andrea",
    "Surname": "Neild",
    "FullName": "Andrea Neild",
    "PostCode": "BL6 5SU"
  },
  {
    "Address": {
      "Address": "5 Prospect Vale\nHeald Green",
      "AddressId": "2127294",
      "AddressLine1": "5 Prospect Vale",
      "AddressLine2": "Heald Green",
      "ContactId": "21178752",
      "County": "Cheshire",
      "Country": "UK",
      "Postcode": "SK8 3RJ",
      "Town": "CHEADLE",
      "FullAddress": "5 Prospect Vale\nHeald Green\r\nCHEADLE\r\nCheshire\r\nSK8 3RJ\r\nUnited Kingdom"
    },
    "ContactId": 21178752,
    "Title": "Mrs",
    "FirstName": "",
    "Surname": "Neild",
    "FullName": " Neild",
    "PostCode": "SK8 3RJ"
  }
]

我正在尝试在jQuery中检索上面的JSON(称为data),如下所示:

 var source =
    {
        localdata: data,
        sort: customsortfunc,
        datafields:
        [
            { name: 'Surname', type: 'string' },
            { name: 'FirstName', type: 'string' },
            { name: 'Title', type: 'string' },
            { name: 'Address.Address', type: 'string' }

        ],
        datatype: "array"
    };
    var dataAdapter = new $.jqx.dataAdapter(source);

    $("#jqxgrid").jqxGrid(
        {
            width: 670,
            source: dataAdapter,
            theme: theme,
            sortable: true,
            pageable: true,
            autoheight: true,
            ready: function () {
                $("#jqxgrid").jqxGrid('sortby', 'FirstName', 'asc');
            },
            columns: [
                { text: 'Title', datafield: 'Title', width: 100 },
                { text: 'First Name', datafield: 'FirstName', width: 100 },
                { text: 'Last Name', datafield: 'Surname', width: 100 },
                { text: 'Address', datafield: 'Address.Address', width: 100 },

            ]
        });

唯一的问题是"Address.Adress"没有显示。有人可以建议我吗?

2 个答案:

答案 0 :(得分:2)

我对你在这里使用的插件一点都不熟悉,但是查看this页面上的信息,我认为使用错误的mapChar是一个问题。

您需要使用Address>Address,或在选项中指定其他mapChar并将其设置为'.'

希望这有帮助。

答案 1 :(得分:0)

在将对象数组传递给网格之前展平它们。

localdata: $.map(data,function(obj){
    return $.extend(obj,{ 
        Address: obj.Address.Address
    });
}),

现在您只需使用"Address"而不是"Address.Address"