easyui增删改查模板

本人比较喜欢js编程，jquery easyui我一直都是用js来写。没用data-bind的方式，感觉比较灵活。一个增删改查模板写得差不多，几乎其他的页面都是复制下，稍微改改。当然。你完全可以做得更好，主人很懒，留下的东西不多。希望对大家有帮助吧！

/******************************************************************************** 

** 描述： 
** 权限对象的增删改查
** 创建人：web开发分享 QQ:378588579  主页:http://www.kuaipao8.com
** 创建时间：2013-5-22
*********************************************************************************/

//datagrid自适应
$(window).resize(function () {
    $('#dgList').datagrid("resize");
});

//重置
function reset() {
    $.clear('dialog');
    $('#hidObjectId').val("");
}

var ObjectHandler = "../Permission/Handler/ObjectHandler.ashx";
var ButtonData = []; //得到权限按钮全局数据

//主程序开始
$(document).ready(function () {

    //得到有权限按钮
  //  ButtonData = $.getButton("objects"); //传表名

    // datagrid列表显示
    $('#dgList').datagrid({
        fitColumns: true,
        height: 'auto',
        width: 'auto',
        fit: true,
        url: Handler(ObjectHandler, [["t", "List"]]),//url自己传
        idField: 'ObjectId',
        nowrap: false,
        collapsible: true,
        sortName: 'ObjectId',
        sortOrder: 'desc',
        rownumbers: true,
        loadMsg: '数据加载中请稍后……',
        pagination: true,
        pageSize: 10,
        pageList: [10, 20, 30, 40],
        border: false,
        columns: [[{ field: 'ObjectId', title: '操作', align: 'center', checkbox: true },
                   { field: 'ObjectName', title: '对象名称', width: 150, align: 'center', sortable: true },
                   { field: 'ObjectCode', title: '对象编码', width: 150, align: 'center', sortable: true },
                   { field: 'Remark', title: '描 述', width: 300 },
                     { field: 'opt', title: '操作', width: 200, align: 'center',
                         formatter: function (value, rowdata, index) {
                             var opt = "<div class='operation' style='border:0'>";
                             opt += '<a id="btnEdit" style="display:" class="datagrid-a" pid="Edit" href="javascript:void(0)" onclick="Edit(' + index + ')">编辑&nbsp;</a>&nbsp;&nbsp;';
                             // opt += '<a id="btnDelete" style="display:none" class="datagrid-a" pid="Delete" href="javascript:void(0)" onclick="Delete(' + index + ')">删除&nbsp;</a>&nbsp;&nbsp;';
                             //opt += "<a href=\"#\" onclick=\"Detail('" + index + "');\" class='datagrid-a'>查看详细</a>"
                             opt += "</div>";
                             return opt;
                         }
                     }

                ]]
                ,
        onLoadSuccess: function (data) {
            //按钮控制
//            $.auth({
//                className: "operation",
//                buttondata: ButtonData,
//                bindings: [{ pid: 'Add' }, { pid: 'Edit' }, { pid: 'Delete'}]
//            });
            if (data.rows.length == 0) {
                var body = $(this).data().datagrid.dc.body2;
                body.find('table tbody').append('<tr><td width="' + body.width() + '" style="height: 25px; text-align: center;" colspan="6">没有数据</td></tr>');
            }
        }
    });
    $('.datagrid-header-inner .datagrid-cell').css("text-align","center");

    //对象信息弹出框
    $('#dialog').dialog({
        title: '&nbsp;对象信息',
        iconCls: 'basket_add',
        width: 450,
        height: 200,
        closed: true,
        modal: true,
        draggable: true,
        buttons: [{
            id: 'btnSave',
            text: '保 存',
            iconCls: 'icon-ok',
            plain: true,
            handler: function () {
                if (!checkAllTextValid(document.forms[0])) {
                    $.messager.alert('提示', '不能输入特殊的字符!', 'error');
                    return false;
                } 
                if (!$("#txtObjectName").validatebox('isValid')) { return false; }
                if (!$("#txtObjectCode").validatebox('isValid')) { return false; }
                $.saveData($('#frmObject').serialize(), ObjectHandler, "Save", function () {
                    $('#dialog').dialog('close');
                    reset();
                    $('#dgList').datagrid('reload');
                });
            }
        }, {
            text: '取 消',
            iconCls: 'icon-cancel',
            plain: true,
            handler: function () {
                $('#dialog').dialog('close');
            }
        }]
    });

    //绑定操作按钮
    bindOperation();

    //回车触发
    document.onkeydown = function (e) {
        var ev = document.all ? window.event : e;
        if (ev.keyCode == 13 || (ev.ctrlKey && ev.keyCode == 13)) {
            if ($(".window").css("display") == "none") {
                $("#btnSearch").click();
            }
            else if ($(".window").css("display") == "block") {
                $("#btnSave").click();
            }
            return false; //忘记加了^_^
        }
    }
});

function bindOperation() {

    //查询按钮
    $("#btnSearch").live('click', function () {
        loadList();

    });

    //添加按钮
    $("#btnAdd").live('click', function () {
        reset();
        RemoveValidateStyle();
        $('#dialog').dialog('open');

    });

    //修改按钮
    $("#btnEdit").live('click', function () {
        RemoveValidateStyle(); //移除验证样式
        var row = $("#dgList").datagrid("getSelected");
        var r = $("#dgList").datagrid("getChecked");
        if (r.length < 1) { $.messager.alert("提示", "请选择一个要修改的对象", "info"); return; }
        if (r.length > 1) {
            $.messager.alert("错误", "一次只能修改一个对象！");
            $("#dgList").datagrid('clearSelections').datagrid('clearChecked');
            return;
        }
        //行记录编辑权限判断
        //        if (!row.CanUpdate) {
        //            $.messager.alert("错误", "对不起，您无权限编辑该条记录！");
        //            $("#dgList").datagrid('clearSelections').datagrid('clearChecked');
        //            return;
        //        }

    });
    //删除按钮
    $("#btnRemove").live('click', function () {
        Delete();
    });
    //刷新按钮
    $("#btnReload").live('click', function () {
        $("#txtSearchKey").val("");
        $('#dgList').datagrid('load', {});
        $('#dgList').datagrid('unselectAll').datagrid('uncheckAll');
    });

}

//查询方法
function loadList() {
    $('#dgList').datagrid('load', { key: $.trim($("#txtSearchKey").val()) });
    $('#dgList').datagrid('unselectAll').datagrid('uncheckAll');
}

//编辑
function Edit(index)  //转到编辑页面  
{
    reset();
    $('#dgList').datagrid('unselectAll').datagrid('uncheckAll');
    var rowAll = $('#dgList').datagrid('getRows');
    $.ajax({
        type: "POST",
        dataType: "json",
        url: Handler(ObjectHandler, [["t", "Get"], ["id", rowAll[index].ObjectId]]),
        success: function (d) {
            var result = d.rows[0];
            $('#hidObjectId').val(result.ObjectId);
            $('#txtObjectName').val(result.ObjectName);
            $('#txtObjectCode').val(result.ObjectCode);
            $('#txtDescription').val(result.Remark);
            $('#dialog').dialog('open');
        },
        error: function () {
            $.messager.alert('错误', '获取失败！', "error");
        }
    });

}

//删除
function Delete(index) {  //删除操作 

    var len = arguments.length;
    if (len == 1) {
        $('#dgList').datagrid('unselectAll').datagrid('uncheckAll');
        var rowAll = $('#dgList').datagrid('getRows');
        var para = [];
        para.push(rowAll[index].ObjectId);
    }
    else if (len == 0) {
        var rows = $('#dgList').datagrid('getSelections');
        //判断是否选择行
        if (!rows || rows.length == 0) {
            $.messager.alert('提示', '请选择要删除的数据!', 'info');
            return;
        }
        //行记录删除权限判断
        var para = [];
        //var delpara = [];
        $.each(rows, function (i, row) {
            para.push(row.ObjectId);
            // delpara.push(row.CanDelete);
        });
        //       if (delpara.in_array(false)) {
        //           $.messager.alert("错误", "对不起，您无权限删除这" + para.length + "条记录！");
        //            return;
        //        }

    }
    $.messager.confirm('系统提示', '是否删除这' + para.length + '笔数据?', function (r) {
        if (!r) return;
        $.ajax({
            type: "POST",
            dataType: "json",
            url: Handler(ObjectHandler, [["t", "Delete"], ["id", para]]),
            cache: false,
            success: function (result) {
                if (!result.success) {
                    $.messager.alert("系统提示", result.msg, "error");
                }
                else {
                    $.messager.alert("系统提示", result.msg, "info", function () {
                        $('#dgList').datagrid('load');
                        $('#dgList').datagrid('unselectAll').datagrid('uncheckAll');
                    });
                }
            },
            error: function () {
                $.messager.alert('错误', '删除失败！', "error");
            }
        });
    });

}

web开发分享