点击jqGrid表格,弹出需要的表格的数据

首先,我们先定义一个函数,然后在JQuery里面直接引用就可以了,

复制代码
function GetJqGridRowValue(jgrid, code) {
    var KeyValue = "";
    var selectedRowIds = $(jgrid).jqGrid("getGridParam", "selarrrow");
    if (selectedRowIds != "") {
        var len = selectedRowIds.length;
        for (var i = 0; i < len ; i++) {
            var rowData = $(jgrid).jqGrid('getRowData', selectedRowIds[i]);
            KeyValue += rowData[code] + ",";
        }
        KeyValue = KeyValue.substr(0, KeyValue.length - 1);
    } else {
        var rowData = $(jgrid).jqGrid('getRowData', $(jgrid).jqGrid('getGridParam', 'selrow'));
        KeyValue = rowData[code];
    }
    return KeyValue;
}//自定义GetJqGridRowValue函数
复制代码

下面是显示表格的JS文件

复制代码
$(function () {
    $("#group").jqGrid({
        url: '/Group/GetGroup',
        datatype: 'json',
        mtype: 'Get',
        colNames: ['GRP_ID', 'GRP_NAME', 'GRP_DESCRIPTION'],//GROUP
        colModel: [
                   { key: true, hidden: true, name: 'GRP_ID', index: 'GRP_ID' },
                   { key: false, name: 'GRP_NAME', index: 'GRP_NAME', editable: true },
                   { key: false, name: 'GRP_DESCRIPTION', index: 'GRP_DESCRIPTION', editable: true },
        ],
        ondblClickRow: function (rowid) {
            var td_id = GetJqGridRowValue("#group", "GRP_ID");
            alert(td_id);
        },//点击获取gqgird的当前列的'GRP_ID'的值
        pager: jQuery('#pager1'),
        rowNum: 5,
        rowList: [5, 10, 15, 20],
        height: '19%',
        viewrecords: true,
        caption: 'Group_Table',
        emptyrecords: '没有记录显示',
        jsonReader: {
            rows: 'rows',
            page: 'page',
            total: 'total',
            records: 'records',
            repeatitems: false,
            id: '0',
            editurl: '/Group/EditGroup'
        },
        autowidth: true,
        multiselect: false,//是否多选
    });
    jQuery("#group").jqGrid('navGrid', "#pager1",
        { edit: true, add: true, del: true, position: 'left', alerttext: "请选择需要操作的数据行!" },
 {
     zIndex: 100,
     url: '/Group/EditGroup',
     closeOnEscape: true,
     closeAfterEdit: true,
     recreateForm: true,
     afterComplete: function (response) {
         if (response.responseText) {
             alert(response.responseText);
         }
     }
 },
    {
        zIndex: 100,
        url: '/Group/CreateGroup',
        closeOnEscape: true,
        closeAfterEdit: true,
        afterComplete: function (response) {
            if (response.responseText) {
                alert(response.responseText);
            }
        }
    },
    {
        zIndex: 100,
        url: '/Group/DeleteGroup',
        closeOnEscape: true,
        closeAfterEdit: true,
        recreateForm: true,
        msg: "你确定要删除么?",
        afterComplete: function (response) {
            if (response.responseText) {
                alert(response.responseText);
            }
        }
    }
    );
});
复制代码

 

posted on   回到印第安  阅读(2283)  评论(0编辑  收藏  举报

编辑推荐:
· 智能桌面机器人:用.NET IoT库控制舵机并多方法播放表情
· Linux glibc自带哈希表的用例及性能测试
· 深入理解 Mybatis 分库分表执行原理
· 如何打造一个高并发系统?
· .NET Core GC压缩(compact_phase)底层原理浅谈
阅读排行:
· 新年开篇:在本地部署DeepSeek大模型实现联网增强的AI应用
· DeepSeek火爆全网,官网宕机?本地部署一个随便玩「LLM探索」
· Janus Pro:DeepSeek 开源革新,多模态 AI 的未来
· 互联网不景气了那就玩玩嵌入式吧,用纯.NET开发并制作一个智能桌面机器人(三):用.NET IoT库
· 上周热点回顾(1.20-1.26)
点击右上角即可分享
微信分享提示