JqGrid- Expanding Subgrid on page load
I have a Jqgrid with subgrid enabled in my MVC 2 project. Subgrid expands and populates data on the button click. I want to expand and show the subgrid data on page load. So i called exapandSubGridRow method on gridComplete event of the parent grid. Now the problem is, subgrid row is expanded on pageload, but with no data, an empty row appears below the parent grid row. Here is my code, Can anyone help me in fixing the problem.
<script type="text/javascript">
jQuery(document).ready(function () {
jQuery("#list").jqGrid({
url: '/jqgrid/DynamicGridData/',
datatype: 'json',
mtype: 'GET',
colNames: ['SurveyQnGrpId', 'SurveyQnGroup1'],
colModel: [
{ name:'SurveyQnGrpId', index:'SurveyQnGrpId', width:40, align:'left' },
{ name:'SurveyQnGroup1',index: 'SurveyQnGroup1',width: 400,
align: 'left'}],
pager: jQuery('#pager'),
rowNum: 10,
rowList: [5, 10, 20, 50],
sortname: 'SurveyQnGrpId',
sortorder: "SurveyQnGroup1",
viewrecords: true,
caption: 'My first grid',
subGrid: true,
subGridUrl: '/jqgrid/InnerGr开发者_运维知识库idData/',
subGridModel: [{
name: ['SurveyQnGrpId','SurveyQnId', 'SurveyQn', 'SurveyQnCategory',
'MandatoryQn','RadioOption3'],
width: [10,10, 100, 10, 10,10],
align: ['left', 'left', 'left', 'left'],
params: ['SurveyQnGrpId']
}],
gridComplete: function () {
var rowIds = $("#list").getDataIDs();
$.each(rowIds, function (index, rowId) {
$("#list").expandSubGridRow(rowId);
});
}
});
});
</script>
Thanks in advance, Ancy
I don't know if this was available at the time this question was asked, but I found there is a subGridOptions
property, takes an object. One of the properties in that object is expandOnLoad
, which, when set to true, will make rows in the parent grid expand when the grid is loaded:
jQuery(document).ready(function () {
jQuery("#list").jqGrid({
url: '/jqgrid/DynamicGridData/',
datatype: 'json',
mtype: 'GET',
colNames: ['SurveyQnGrpId', 'SurveyQnGroup1'],
colModel: [
{ name:'SurveyQnGrpId', index:'SurveyQnGrpId', width:40, align:'left' },
{ name:'SurveyQnGroup1',index: 'SurveyQnGroup1',width: 400,
align: 'left'}],
pager: jQuery('#pager'),
rowNum: 10,
rowList: [5, 10, 20, 50],
sortname: 'SurveyQnGrpId',
sortorder: "SurveyQnGroup1",
viewrecords: true,
caption: 'My first grid',
subGrid: true,
subGridOptions: { expandOnLoad: true },
subGridUrl: '/jqgrid/InnerGridData/',
subGridModel: [{
name: ['SurveyQnGrpId','SurveyQnId', 'SurveyQn', 'SurveyQnCategory',
'MandatoryQn','RadioOption3'],
width: [10,10, 100, 10, 10,10],
align: ['left', 'left', 'left', 'left'],
params: ['SurveyQnGrpId']
}],
gridComplete: function () {
var rowIds = $("#list").getDataIDs();
$.each(rowIds, function (index, rowId) {
$("#list").expandSubGridRow(rowId);
});
}
});
});
See: http://www.trirand.com/jqgridwiki/doku.php?id=wiki:subgrid
精彩评论