0

我正在尝试在 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

4

1 回答 1

1

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

  • 您将两者都包括在内query.jqGrid.min.js，而不是仅从文件query.jqGrid.src.js中使用一个。
  • 您的GetDataFromDB方法返回结果string是错误的。您应该返回具有属性total、page等的对象rows。目前您进行手动 JSON 序列化，生成的字符串将再序列化一次。
  • 您使用datatypeas 函数，这是多年前所需要的，在此之前引入了此处描述的新参数。您当前的实现datatype函数是错误的，因为它在从服务器接收任何结果之前进行异步Ajax 调用并返回。服务器结果将被丢弃。
  • 从服务器返回的 JSON 数据包含网格行的两个字符串 ( ["Robbie","2"])，但您定义了树列
  • ...

我可以继续...

所以我建议你看看其他一些将 ASMX Web 服务与 jqGrid 结合使用的代码示例。例如，您可以在这里下载一个工作演示。在答案中，您将找到另一个演示。

于 2011-09-14T13:52:58.793 回答