你的位置:首页 > Java教程

[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'    },    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);      }    }  }  );});