zoukankan      html  css  js  c++  java
  • 点击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'
            },
            auto 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);
                }
            }
        }
        );
    });
  • 相关阅读:
    [转]MySql 5.7关键字和保留字-附表
    [转]超链接标签简单的几个样式属性
    layui table 前台数字格式保留两位小数,不足补0(mysql 数据库)
    [转]Object.keys()和for in的排序问题
    [转]对form:input标签中的数字进行格式化
    [转]bootstrap table 动态列数
    [转]bootstrap的table插件动态加载表头
    [转]【MyBatis】Decimal映射到实体类出现科学计数法问题
    [转]MySQL函数大全 及用法示例
    [转]mysql update case when和where之间的注意事项
  • 原文地址:https://www.cnblogs.com/hebo/p/5011191.html
Copyright © 2011-2022 走看看