jqgrid单击行时如何扩展/折叠子网格 [英] jqgrid how to expand/collapse subgrid when click a row
本文介绍了jqgrid单击行时如何扩展/折叠子网格的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我需要单击一行,如果
- 将子网格折叠,然后将其展开.
- 展开子网格,然后将其折叠.
我发现问题是此处,但是@Oleg推荐在我的项目中不起作用.我已经调试了它,发现"onSelectRow"将被执行两次.例如
I found the question is here, but @Oleg sugesstion didn't work in my project. I have debuged it and found the "onSelectRow" will be executed twice. for example,
onSelectRow: function (row_id) {
alert("hello");
},
它将收到两个警报.所以,如果我这样写:
It will get two alert. So, if I write this:
onSelectRow: function (row_id) {
$("#grd").toggleSubGridRow(row_id);
},
它将展开和折叠,(实际上,我看不到该过程,而是通过调试找到了它). 这是我的代码,请忽略其中的中文.
it will expand and collapse,(actually, I can't see the process, I find it by debugging). This is my code, please ignore the Chinese in it.
jQuery("#grd").jqGrid({
url:'__APP__/Spot_sales/get_sale_order_masters',
mtype: 'post',
datatype: "json",
colNames:['id','uid','日期','销售单号','客户名称','应收金额','实收金额','状态'],
colModel:[
{name:'id',index:'id', hidden:true},
{name:'uid',index:'uid', hidden:true},
{name:'order_date',index:'order_date', width:100, align:'center'},
{name:'orderNo',index:'orderNo', width:100, align:'center'},
{name:'customer',index:'customer', width:100, align:'center'},
{name:'sum_money',index:'sum_money', width:100, align:'center'},
{name:'receive_money',index:'receive_money', width:100, align:'center'},
{name:'status',index:'status', width:100, align:'center'}
],
sortname: 'order_date',
sortorder: "desc",
viewrecords: true,
pager:'#pager',
rowNum:10,
autowidth: true,
height:'auto',
multiselect: false,
onSelectRow: function (row_id) {
$("#grd").toggleSubGridRow(row_id);
},
subGrid : true,
subGridOptions: { "plusicon" : "ui-icon-triangle-1-e",
"minusicon" :"ui-icon-triangle-1-s",
"openicon" : "ui-icon-arrowreturn-1-e",
"reloadOnExpand" : true,
"selectOnExpand" : true },
subGridRowExpanded: function(subgrid_id, row_id) {
var subgrid_table_id;
subgrid_table_id = subgrid_id+"_t";
jQuery("#"+subgrid_id).html("<table id='"+subgrid_table_id+"' class='scroll'></table>");
jQuery("#"+subgrid_table_id).jqGrid({
url:'__APP__/Spot_sales/get_sale_order_details?so_id='+$("#grd").getRowData(row_id)['id'],
mtype: 'get',
data:{},
datatype: "json",
colNames: ['id','so_id','产品编号','数量','单位','单价'],
colModel: [
{name:"id",index:"id",hidden:true},
{name:"so_id",index:"so_id",hidden:true},
{name:"productNo",index:"productNo",width:100},
{name:"quantity",index:"quantity",width:100,align:"right"},
{name:"unit",index:"unit",width:80,align:"right"},
{name:"price",index:"price",width:100,align:"right"}
],
rownumbers: true,
height: '100%',
sortname: 'id',
sortorder: "asc"
});
}
}).navGrid("#pager",{edit:false,add:false,del:false,refresh:false,search:false});
推荐答案
一个选项是在行单击事件上扩展子网格.
An option is to expand the subgrid on the row click event.
$(document).on("click", "#grd tr.jqgrow", function (e) {
var id = jQuery('#grd').jqGrid('getGridParam', 'selrow');
if (id != null) {
jQuery('#grd').expandSubGridRow(id);
}
});
这篇关于jqgrid单击行时如何扩展/折叠子网格的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文