Question

这是我第一个使用jQGrid的例子，我编写了以下代码。显示了网格，但数据没有绑定。我看了很多例子，但没有找到答案

这是我的Jquery代码

jQuery("#jQGridDemo").jqGrid({
                            url: 'http://localhost:7887/application/get',
                            datatype: "json",
                            contentType: 'application/json; charset=utf-8',
                            page: 1,
                            loadonce: true,
                            gridView: true,
                            loadonce: true,

                            colNames: ['Application ID', 'Application Name', 'PageLink', 'CreatedDate'],
                            colModel: [
                                { name: 'ApplicationId', key: true, width: 75 },
                                { name: 'ApplicationName', width: 150 },
                                { name: 'PageLink', width: 150 },
                                { name: 'CreatedDate', width: 150 }

                            ],

                            width: 750,
                            height: 250,
                            rowNum: 20,
                            scroll: 1, // set the scroll property to 1 to enable paging with scrollbar - virtual loading of records
                            emptyrecords: 'Scroll to bottom to retrieve new page', // the message will be displayed at the bottom 
                        })

我正在使用网络API 2这是c＃代码

    [Route("get")]
    [HttpGet]
public HttpResponseMessage GetApplicationData()
{
    //string pno = Request.RequestUri.ToString();

    DataSet ds = new DataSet();

    FillDataSet(ref ds);

    DataTable dt = ds.Tables[0];
    var Jsonresponse = JsonConvert.SerializeObject(dt);
    return Request.CreateResponse(HttpStatusCode.OK, Jsonresponse);
}

响应以下列格式显示..

"[{\"ApplicationId\":1,\"ApplicationName\":\"Home\",\"PageLink\":\"~/web/Index.aspx\",\"CreatedDate\":\"2013-08-14T12:09:07.93\"},{\"ApplicationId\":2,\"ApplicationName\":\"Identify\",\"PageLink\":\"~/Web/Material/Home.aspx\",\"CreatedDate\":\"2013-08-14T12:09:07.93\"}........]"

任何人都可以告诉我为什么这些数据没有绑定到网格上，请提示一些参考资料来学习使用JQGrid

Answer 1

我建议您执行以下操作：

从http://localhost:7887删除url: 'http://localhost:7887/application/get'前缀。对应Same-origin policy，您不能将默认的Ajax请求作为HTML页面的源（另一个服务器或其他端口）作为另一个源。因此，最好在网址中使用绝对路径'/application/get'或相对路径'application/get'。
您应该删除JavaScript代码中的语法错误。例如，使用loadonce: true 两次是语法错误。
JavaScript是区分大小写的语言。所以你应该仔细考虑你使用的所有参数。例如，没有gridView选项。您应该使用gridview: true代替。
我建议您至少在开始时使用scroll: 1。虚拟滚动在使用其他方法时存在许多小问题和限制。您可以使用toppager: true来添加标准寻呼机。
我建议您使用height: "auto"和autoencode: true选项。
jqGrid没有contentType选项。你的意思是ajaxGridOptions: {contentType: 'application/json; charset=utf-8'}

现在我认为您的代码服务器部分存在问题。如果您使用datatype: "json"，那么HTTP请求将在HTTP标头中包含Accept: application/json。因此，通常使用IEnumerable<Application>之类的内容作为GetApplicationData()的结果值。 Web API 2将根据Accept: application/json将生成的对象转换为JSON 自动。如果您将不需要的手动转换为JSON，那么Web API 2将假定字符串（而不是项目数组）是返回的数据类型。对应于JSON标准，所有引用"都将被转义。因此，响应包含字符串

"[{\"ApplicationId\":1,\"ApplicationName\":\"Home\",...}...]"

而不是

[{"ApplicationId":1,"ApplicationName":"Home",...}...]

要解决此问题，您应更改GetApplicationData()的返回类型，并删除不需要的JsonConvert.SerializeObject手动调用。

我建议您使用{/ 3}}或IE / Chrome / Firefox的开发者工具（按 F12 启动）来跟踪客户端和服务器之间的HTTP流量。这对于共同理解和故障排除非常重要。

Json数据没有绑定到jqgrid

1 个答案: