EasyUI_DataGrid数据操作

1、html:

<div style=" 1100px;height: 350px ;overflow: scroll">
                <table id="DataTb" title="客户信息" class="easyui-datagrid" style="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 == 1) {
                    $.messager.alert("操作提示：", data.msg);
                    $("#DataTb").datagrid('load', ({}))
                } else {
                    $.messager.alert("操作提示:", data.msg);
                }
            }
        })
    }