用json和web服务填充数据表

时间:2014-09-03 07:48:16

标签: json jquery-datatables

我需要在客户端调用的表中显示数据,所以我需要填充数据表并将其显示到表视图中,只需检查我的代码是否需要包含任何最小文件或更改任何代码,帮助我。  我的客户端代码

<script src="Scripts/jquery1.11.1.js" type="text/javascript"></script>
<script src="Scripts/jquerydatable1.10.2.js" type="text/javascript"></script>
<script src="Scripts/display_cusdetail_jqgrid.js" type="text/javascript"></script>
  </head>
 <body>
<form id="form1" runat="server">
  <div>
    <b>customer details</b>
      <input type="button" id="button1" value="clickme" />
  <div id="divformytable">
   <table id="tablename">   
      <tr>
      <td>
      </td>
      </tr> 
    </table>  
   </div></div></form></body>

我的脚本文件:display_cusdetail_jqgrid.js

        $(document).ready(function () {
       $("#button1").click(function (event) {
    $.ajax({
        type: "POST",
        url: "Name.asmx/Display",
        data: "{}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: AjaxSucceeded,
        error: AjaxFailed
       });
       });
      });
      function AjaxSucceeded(result) {
         alert("hi");
         if (result.hasOwnProperty("d")) {
          result = result.d;
             }
         //  var data = jQuery.parseJSON(result);
         $('#divformytable').html('<table cellpadding="0" cellspacing="0" border="0"          id="tablename" class="style1 datatable"></table>');
         $('#tablename').dataTable({
            "bPaginate": true,
           "sPaginationType": "full_numbers",
             "bAutoWidth": true,
             "bJQueryUI": false,
             "bLengthChange": true,
           //"fnRowCallback": customFnRowCallback,
            "aaData": aaData,
             "aoColumns": [
               //Assign the data to rows
   {"mDataProp": "eid", "sTitle": "0", "bSearchable": false, "bVisible": true },
   { "mDataProp": "ename", "sTitle": "1", "bSearchable": false, "bVisible": true  },
   { "mDataProp": "dob", "sTitle": "2", "bSearchable": false, "bVisible": true },
   { "mDataProp": "addr", "sTitle": "3", "bSearchable": false, "bVisible": true },
   { "mDataProp": "pincode", "sTitle": "4", "bSearchable": false, "bVisible": true },
   { "mDataProp": "dsgid", "sTitle": "5", "bSearchable": false, "bVisible": true },
   { "mDataProp": "salary", "sTitle": "6", "bSearchable": false, "bVisible": true},     {"mDataProp": "doj", "sTitle": "7", "bSearchable": false, "bVisible": true }
             ]
            });
             }

当我运行它时,它在这行中显示错误aaData:aaData未定义,任何人帮助我

0 个答案:

没有答案