2

I have a webservice which return data in json

[WebMethod]
    public string json_Getdata()
    {
        DataTable dt = new DataTable();
        dt.Columns.Add("id", typeof(string));
        dt.Columns.Add("name", typeof(string));
        dt.Columns.Add("Age", typeof(string));
        dt.Columns.Add("Country", typeof(string));
        dt.Columns.Add("Address", typeof(string));
        dt.Columns.Add("Phone", typeof(string));

        for (int i = 1; i < 6; i++)
        {
            DataRow dr = dt.NewRow();
            dr["id"] = i.ToString();
            dr["name"] = "Mr. xyz";
            dr["Age"] = (24 + i).ToString();
            dr["Country"] = "India";
            dr["Address"] = "H no- 456" + i;
            dr["Phone"] = "125896" + i;
            dt.Rows.Add(dr);
        }
        return JsonConvert.SerializeObject(dt, Newtonsoft.Json.Formatting.Indented);
    }

I want to fill this data into jsgrid , sample code is below from their website

    $(function() {

    $("#jsGrid").jsGrid({
        height: "90%",
        width: "100%",

        filtering: true,
        editing: true,
        sorting: true,
        paging: true,
        autoload: true,

        pageSize: 15,
        pageButtonCount: 5,

        deleteConfirm: "Do you really want to delete the client?",

        controller: db,

        fields: [
            { name: "Name", type: "text", width: 150 },
            { name: "Age", type: "number", width: 50 },
            { name: "Address", type: "text", width: 200 },
            { name: "Country", type: "select", items: db.countries, valueField: "Id", textField: "Name" },
            { name: "Married", type: "checkbox", title: "Is Married", sorting: false },
            { type: "control" }
        ]
    });

});

after consuming the webservice 

<script type="text/javascript">
$(function () {
    $.ajax({
        type: "POST",
        url: "http://localhost:50015/WebService1.asmx/json_Getdata",
        data: '{}',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: OnSuccess,
        failure: function (response) {
            debugger;
            alert(response.d);
        },
        error: function (response) {
            debugger;
            alert(response.d);
        }
    });
});

function OnSuccess(response) {
    var  records = response.d;
    debugger;
}

I m getting data like below

[ 
{"id": "1","name": "Mr. xyz","Age": "25","Country": "India","Address": "H no- 4561","Phone": "1258961"},
{"id": "2","name": "Mr. xyz","Age": "26","Country": "India","Address": "H no- 4562","Phone": "1258962"},
{"id": "3","name": "Mr. xyz","Age": "27","Country": "India","Address": "H no- 4563","Phone": "1258963"},
{"id": "4","name": "Mr. xyz","Age": "28","Country": "India","Address": "H no- 4564","Phone": "1258964"},
{"id": "5","name": "Mr. xyz","Age": "29","Country": "India","Address": "H no- 4565","Phone": "1258965"}
]

As per my understanding it is in array but i am not able to access data by index (like records[0].name) - it always show undefined
Cabn someone tell me why is this happening

4

1 回答 1

1 
$(function() {

    $("#jsGrid").jsGrid({
        height: "90%",
        width: "100%",

        filtering: true,
        editing: true,
        sorting: true,
        paging: true,
        autoload: true,

        pageSize: 15,
        pageButtonCount: 5,

        deleteConfirm: "Do you really want to delete the client?",
       controller: {
                loadData: function (filter) {
                    var d1 = $.Deferred();                 
                    $.ajax({
                       type: "POST",
                       url: "http://localhost:50015/WebService1.asmx/json_Getdata",
                       data: '{}',
                       contentType: "application/json; charset=utf-8",
                       dataType: "json",
                    }).done(function (response) {
                        d1.resolve(jQuery.parseJSON(response.d));
                    });

                    return d1.promise();
                },
            },
        fields: [
            { name: "Name", type: "text", width: 150 },
            { name: "Age", type: "number", width: 50 },
            { name: "Address", type: "text", width: 200 },
            { name: "Country", type: "select", items: db.countries, valueField: "Id", textField: "Name" },
            { name: "Married", type: "checkbox", title: "Is Married", sorting: false },
            { type: "control" }
        ]
    });
});

请尝试这个从网络方法获取数据。

于 2017-07-05T06:00:08.750 回答