获取错误：colNames <> colModel或0的长度！在jqgrid

Question

我使用jQgrid来显示数据库中的数据。

当点击我的按钮，我收到此错误：

length of colNmaes <>colModel or 0! 

这里是我的代码：

$(document).ready(function() { 
    $('#btndist').click(function() { 
     $.ajax({ 
      url:"default.aspx/loaddata", 
      datatype:"json", 
      data: "{}", 
      contentType: "application/json;charset=utf-8", 
      method:"POST", 
      success: function (result) { 
       result=result.d; 
       jQuery("#Distable").jqGrid({ 
        datatype: "local", 
        colModel: [ 
         { name:"EmpID", index:"EmpID",width:80}, 
         { name:"EmpFisrtName", index:"EmpFisrtName", width: 80 }, 
         { name:"EmpLastName", index:"EmpLastName", width: 80 }, 
         { name:"EmailAddress", index:"EmailAddress", width: 80 }, 
         { name:"MobileNo", index:"MobileNo", width: 80 }, 
         { name:"CityName", index:"CityName", width: 80 } 
        ], 
        data: JSON.parse(result), 
        rowNum: 10, 
        loadonce: true,       
        rowList: [5, 10, 20], 
        pager: '#DistPager', 
        viewrecords: true, 
        sortorder: 'asc', 
        gridview: true, 
        autowidth:true, 
        sortname: 'EmpName', 
        height:'auto', 
        altRows: true, 
        hoverrows: true, 
        caption:"List Employee Details"       
       }); 
      }, 
      error: function (error) { 
       alert("Oops an error"); 
      } 
     }); 
    }); 
}); 

任何一个可以告诉我为什么我收到错误？

Answer 1

您必须添加如下所示的colNames。

colNames: ['Emp ID', 'Fisrt Name', 'Last Name', 'Email', 'Mobile No', 'City'] 

这将显示为列标题。

更新：删除ajax电话，jqGrid可以从url加载数据本身。

$(document).ready(function() { 
    $('#btndist').click(function() { 
     jQuery("#Distable").jqGrid({ 
      url: "default.aspx/loaddata", 
      datatype: "json", 
      colNames: ['Emp ID', 'Fisrt Name', 'Last Name', 'Email', 'Mobile No', 'City'], 
      colModel: [ 
       { name: "EmpID", index: "EmpID", width: 80 }, 
       { name: "EmpFisrtName", index: "EmpFisrtName", width: 80 }, 
       { name: "EmpLastName", index: "EmpLastName", width: 80 }, 
       { name: "EmailAddress", index: "EmailAddress", width: 80 }, 
       { name: "MobileNo", index: "MobileNo", width: 80 }, 
       { name: "CityName", index: "CityName", width: 80 } 
      ], 
      rowNum: 10, 
      loadonce: true, 
      rowList: [5, 10, 20], 
      pager: '#DistPager', 
      viewrecords: true, 
      sortorder: 'asc', 
      gridview: true, 
      autowidth: true, 
      sortname: 'EmpName', 
      height: 'auto', 
      altRows: true, 
      hoverrows: true, 
      caption: "List Employee Details" 
     }); 
    }); 
});