jqGrid增删改查显示——查找

本篇文章只介绍jqGrid增加操作，希望能帮到大家~！有不正确的请指出！谢谢！

本篇文章代码在以下一篇文章代码基础上修改：
jqGrid显示：http://blog.csdn.net/tangjiarao/article/details/50454695

演示效果：

核心代码：

$(document).ready(function () {                $.ajax({                            url: "/userFindAction",                            type: "GET",                            dataType: "json",                            success: function (data) {                                window.datas = data.result;                                // Auto height step 1: Set .content-pager height = window heigth - 250px                                $(".content-pager").height($(window).height() - 400);                                // Setup grid                                jQuery("#jqGrid01").jqGrid({                                    //url :'/userFindAction',                                    data: datas,                                    datatype: "local",                                    jsonReader: {                                        repeatitems: false                                    },                                    height: $('.content-pager').height(), // Auto height step 2,                                    rowNum: 10,                                    rowList: [10, 20, 30],                                    colNames: ['userId', 'userName', 'accountName', 'accountPassword', 'roleType', 'schoolName', 'schoolClassName', 'active',''],                                    colModel: [                                        {name: 'userId', index: 'userId', width: 60,hidden:true},                                        {                                            name: 'userName',                                            index: 'userName',                                            width: 100,                                            editable: true,                                            editoptions: {size: "20", maxlength: "30"}                                        },                                        {                                            name: 'accountName',                                            index: 'accountName',                                            width: 100,                                            editable: true,                                            editoptions: {size: "20", maxlength: "30"}                                        },                                        {                                            name: 'accountPassword',                                            index: 'accountPassword',                                            width: 120,                                            search:false                                        },                                        {                                            name: 'roleType',                                            index: 'roleType',                                            width: 80,                                            editable: true,                                            editrules: true,                                            edittype: "select",                                        },                                        {                                            name: 'schoolName',                                            index: 'schoolName',                                            width: 150,                                            editable: true,                                            editrules: true,                                            edittype: "select",                                            editoptions: {                                                dataEvents: [                                                    {                                                        type: 'change',          //下拉选择的时候                                                        fn: function (e) {                                                            var itemName = this.id;                                                            var selectNum = itemName.match(/^\d+/);                                                            var schoolName =this.value;                                                            getSchoolClass(selectNum,schoolName);                                                        }                                                    }                                                ]                                            }                                        },                                        {                                            name: 'schoolClassName',                                            index: 'schoolClassName',                                            width: 150,                                            editable: true,                                            edittype: "select",                                            editoptions: {value: {'请选择班级': '请选择班级'}}                                        },                                        {                                            name: 'active', index: 'active', width: 60,sortable : false                                        },                                        {                                            name : 'act',index : 'act',width : 75,sortable : false,search:false                                        },                                    ],                                    pager: "#jqGridPager01",                                    viewrecords: true,                                    add: true,                                    edit: true,                                    addtext: 'Add',                                    edittext: 'Edit',                                    caption: "User Management",                                    hidegrid: false,                                    multiselect: true,                                    altRows: true,                                    rownumbers: true,                                    mtype: "get",                                    loadComplete: function () {                                        getSchool();                                        getRole();                                        setReset();                                        setEdit();                                    },                                });                                jQuery("#jqGrid01").navGrid('#jqGridPager01', {                                    edit: false,                                    add: false,                                    del: false,                                    search: true                                },{},{},{},{multipleSearch:true})                                        .navButtonAdd('#jqGridPager01', {                                            caption: "", buttonicon: "ui-icon-circle-plus", onClickButton: function () {                                                $("select#schoolClassName").empty();                                                var str = "<option>" + "请选择班级" + "</option>";                                                var schoolClassName = $("select#schoolClassName");                                                schoolClassName.append(str);                                                jQuery("#jqGrid01").jqGrid('editGridRow', "new", {                                                    url: '/registerAction',                                                    height: 300,                                                    mtype: "POST",                                                    reloadAfterSubmit: false,                                                    closeAfterAdd: true,                                                    onclickSubmit: function (params, postdata) {                                                        var roleTypeName=$.trim($("#editmodjqGrid01").find("#roleType").val())                                                        for(var i=0;i<roleResult.length;i++){                                                            if(roleTypeName==roleResult[i].roleType){                                                                var userGroup = new Array();                                                                userGroup.push({                                                                    userName: $.trim($("#editmodjqGrid01").find("#userName").val()),                                                                    accountName: $.trim($("#editmodjqGrid01").find("#accountName").val()),                                                                    accountPassword: '12345',                                                                    roleType: roleResult[i]._id,                                                                    schoolClassName: $.trim($("#schoolClassName").find("option:selected").attr('schoolid'))                                                                });                                                                break;                                                            }                                                        }                                                        return {userGroup:userGroup};                                                    },                                                    afterSubmit : function(response, postdata) {                                                        var result=response.responseJSON;                                                        if(result.success==1){                                                            switch (result.code){                                                                case 0:                                                                    return [false,"用户名已经存在！"]                                                                    break;                                                                case 2:                                                                    return [false,"保存部分用户成功,其余用户名已存在！"]                                                                    break;                                                                case 1:                                                                    window.wxc.xcConfirm("保存用户成功", window.wxc.xcConfirm.typeEnum.info);                                                                    //alert("保存用户成功！");                                                                    return [true,""]                                                                    break;                                                            }                                                        }                                                        else{                                                            return [false,"创建用户失败！"]                                                        }                                                    }                                                });                                            },                                            position: "first"                                        })                                        .navButtonAdd('#jqGridPager01', {                                            caption: "", buttonicon: "ui-icon-trash", onClickButton: function () {                                                //alert("really delete the selected item?");                                                var selectedRowIds = $("#jqGrid01").jqGrid("getGridParam", "selarrrow");                                                if(selectedRowIds==""){                                                    window.wxc.xcConfirm("请选择要删除的行！", window.wxc.xcConfirm.typeEnum.info);                                                }                                                else{                                                    var txt=  "是否删除用户";                                                    var option = {                                                        title: "信息",                                                        btn: parseInt("0011",2),                                                        onOk: function(){                                                            var len = selectedRowIds.length;                                                            var userId =new Array();                                                            for (var i = 0; i <len; i++) {                                                                userId[i]=datas[selectedRowIds[i]-1].userId;                                                            }                                                            $.ajax({                                                                type: "post",                                                                url: "/userRemoveAction",                                                                data: {userId:userId},                                                                dataType: "json",                                                                success: function (data) {                                                                    if(data.success==1){                                                                        for (var i = 0; i < len; i++) {                                                                            $("#jqGrid01").jqGrid("delRowData", selectedRowIds[0]);                                                                        }                                                                    }                                                                }                                                            });                                                        }                                                    }                                                    window.wxc.xcConfirm(txt, "custom", option);                                                }                                            },                                            position: "first"                                        })                                        .navSeparatorAdd("#jqGridPager01", {sepclass: "ui-separator", sepcontent: ''});                                $("#jqGrid01").jqGrid('setGridWidth', $(".content-pager").width(), true);                            },                            error: function () {                            }                        }                );            });

主要代码：

jQuery("#jqGrid01").navGrid('#jqGridPager01', {                                    edit: false,                                    add: false,                                    del: false,                                    search: true                                },{},{},{},{multipleSearch:true})//调用搜索方法

如果定义search:false，则不能作为查找参数，默认为true，如：

 {     name : 'act',index : 'act',width : 75,sortable : false,search:false },

相关文章：

http://blog.csdn.net/tangjiarao/article/details/50456160  联动下拉
http://blog.csdn.net/tangjiarao/article/details/50460146  增加
http://blog.csdn.net/tangjiarao/article/details/50460780  修改
http://blog.csdn.net/tangjiarao/article/details/50461122  删除

参考文章：

http://blog.mn886.net/jqGrid/ api