从Ajax response（Json）错误构建表行：“无效字符”

Question

I'm successfully getting the response as jSon from my code behind c#. While converting jSon to table in jQuery it throwing error('Invalid Character'). here is my code:

$('#reports').click(function () {
        var pageUrl = '<%= ResolveUrl("~/Admin.aspx/SystemstatusReport")%>';
        $.ajax({
            type: 'POST',
            url: pageUrl,
            contentType: 'application/json; charset=utf-8',
            success: function (data) {
                var response = $.parseJSON(data);

                $(function () {
                    $.each(response, function (i, item) {
                        var $tr = $('<tr>').append(
                            $('<td>').text(item.SystemID),
                            $('<td>').text(item.SystemIP),
                            $('<td>').text(item.SystemStatus)
                        ); 
                        console.log($tr.wrap('<p>').html());
                    });
                });
            },
            error: function (data, success, error) {
                alert("Error:" + error);
            }
        });
    });

My c# [WebMethod]

public static string SystemstatusReport()
{
    using (OleDbConnection con=new OleDbConnection( conStr))
    {
        con.Open();
        string query = "SELECT * FROM SystemStatus";
        using (OleDbDataAdapter da=new OleDbDataAdapter( query,con))
        {
            DataSet ds=new DataSet();
            da.Fill(ds);
            DataTable dt = ds.Tables[0];
            var jsonString = DataTableToJson(dt);                
            return jsonString;
        }
    }

}

Edit:

My json response:

[{ "SystemId": 1753259, "IP": "1855652", "SystemStatus": "online" },{ "SystemId": 1753359, "IP": "1585652", "SystemStatus": "online" }]

Answer 1

It should be data.d as shown below:

 var response = $.parseJSON(data.d);

Because C# => 3.5 serialize all JSON responses into a variable d.

You need to change your code as below:

$(function () {
                    $.each(response, function (i, item) {
                        var $tr = $('<tr>').append(
                            $('<td>').text(item.SystemId),
                            $('<td>').text(item.IP), 
                            $('<td>').text(item.SystemStatus)
                        ); 
                        console.log($tr.wrap('<p>').html());
                    });
                });

You need to give exact name as it is in Json response.

Demo: http://jsfiddle.net/Rj9bR/57/

Answer 2

I used JSON.parse method to get the json string. Below is my code

success: function (data) {
            var sam = JSON.parse(data);

            $(function () {
               var trHTML = '';
    for (var i = 0; i < sam.length; i++) {
        trHTML += '<tr><td>' + sam[i].IP + '</td><td>' + sam[i].SystemID + '</td><td>' + sam[i].Bay + '</td></tr>';
    }$('#records_table').append(trHTML);
                });
            });       

And also I forgot to mention index of the JSON object.