ASP.NET中的JqGrid未绑定

Question

我正在尝试在asp.net中实现jqGrid。

这是我的代码。

    <script type="text/javascript" src="../js/i18n/grid.locale-en.js"></script>
    <script type="text/javascript" src="../js/jquery.jqGrid.min.js"></script>
    <script type="text/javascript" src="../js/jquery.jqGrid.src.js"></script>
    <script src="../js/plugins/grid.postext.js" type="text/javascript"></script>


     <script type="text/javascript">
    $(document).ready(function(){
    jQuery("#tdList").jqGrid({
    type: "POST",
        datatype: function() {
            $.ajax
            ({

                url: "WebService1.asmx/GetDataFromDB",
                 data: "{}",
                datatype: 'json',
                contentType: "application/json; charset=utf-8",


            });
        },

        height: "100%",
        width: "100%",
        forceFit: true,
        colNames: ['EmpID', 'Name', 'MGR'],
        colModel: [
                    { name: 'EmpID', index: 'EmpID', key: true, hidden: true },
                    { name: 'Name', index: 'Name', width: 100 },
                    { name: 'MGR', index: 'MGR', width: 100 }
                  ],
        rowNum: 10,
        rowList: [5, 10, 15],
        pager: $('#pager'),
        sortname: 'EmpID',
        viewrecords: true,
        sortorder: "desc",
        caption: "Customer List"



    }).navGrid('#pager', { del: false, add: false, edit: false });
    });

而后面的代码是

namespace JqGrid_App{    
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[ToolboxItem(false)]

[System.Web.Script.Services.ScriptService]
public class WebService1 : System.Web.Services.WebService
{

    [WebMethod]
    public string HelloWorld()
    {
        return "Hello World";
    }

    [WebMethod(EnableSession = false)]
    [ScriptMethod(ResponseFormat = ResponseFormat.Json, UseHttpGet = true)]
    public string GetDataFromDB()
    {
        _Default OGetData = new _Default();
       return  OGetData.GetDataFromDB();
    }
}}

返回的JSONData具有以下格式

{
"total":1,
"page":1,
"records":1,
"rows":[
    {"id":"6","cell":["Robbie","2"]}
       ]
}

但是网格没有绑定数据。

请帮忙。 我在这里做错了。 我正在尝试解决最近2天的问题。

最好的问候，Mlg

Answer 1

您在代码中犯了太多错误：

• 你既包括query.jqGrid.min.js和query.jqGrid.src.js ，而不是只使用一个从文件。
• 您的GetDataFromDB方法返回的结果为string错误。 您应该返回具有属性total ， page ， rows等的对象。 当前，您将进行手动JSON序列化，并且生成的字符串将再次序列化一次 。
• 您可以将datatype用作函数，例如，在引入此处介绍的新参数之前，这需要很多年。 您当前的实现datatype函数是错误的，因为它会在从服务器接收任何结果之前进行异步 Ajax调用并返回。 服务器结果将被丢弃。
• 从服务器返回的JSON数据包含用于网格行（ ["Robbie","2"] ）的两个字符串，但是您定义了树列
• ...

我可以继续...

因此，我建议您仅看一下其他将jxGrid与ASMX Web服务结合使用的代码示例。 例如，您可以在此处下载一个有效的演示。 在答案中，您将找到另一个演示。