EasyUI_DataGrid数据操作

1、html:

 <div style="width: 1100px;height: 350px ;overflow: scroll">
                 <table id="DataTb" title="客户信息" class="easyui-datagrid" style="width:2000px;height:330px"
                     idfield="itemid" pagination="true" fitcolumns="true"
                     data-options="iconCls:'icon-save',rownumbers:true,url:'../Ajax/Customer.ashx?action=getlist',pageSize:10, pageList:[5,10,15,20],method:'get',toolbar:'#tb',striped:true,singleSelect:true">
                     <thead>
                         <tr>
                           <th>绑定每列数据</th>
                         </tr>
                     </thead>
                 </table>
             </div>

2、加载，查询：

   function search() {
         $('#DataTb').datagrid('load', {
             CompanyName: $(".CompanyName").val(),
             CompanyPhone: $(".CompanyPhone").val(),
              …………
         })
     }

3、OnRowClick事件：当用户点击一行时触发，参数包括：rowIndex：被点击行的索引，从 0 开始，rowData：被点击行对应的记录

 $(function () {
         $("#DataTb").datagrid({
             onClickRow: function (index, row) {
                  KhNumber = row["KhNumber"];
                 $(".CompanyName").val(row["CompanyName"]);
                 $(".CompanyAddress").val(row["CompanyAddress"]);
              …………
             }
         })
     })

4、删除

  function Delete() {
         var s = $("#DataTb").datagrid("getSelected");
         var id = s.Id;
         $.ajax({
             url: "../Ajax/Customer.ashx?action=delete&id=" + id,
             type: "POST",
             dataType: "json",
             success: function (data) {
                 if (data.code == ) {
                     $.messager.alert("操作提示：", data.msg);
                     $("#DataTb").datagrid('load', ({}))
                 } else {
                     $.messager.alert("操作提示:", data.msg);
                 }
             }
         })
     }