EasyUI Forum

General Category => Bug Report => Topic started by: graveytrain on September 03, 2014, 05:08:53 PM



Title: EasyUI 1.4 ScrollView DetailFormatter Index
Post by: graveytrain on September 03, 2014, 05:08:53 PM
detailFormatter while using Scrollview losses index when scrollview reloads data.  it then restarts at 0, causes expandRow issues

Workaround is to add a unique ID to data and run the detailFormatter and sub table based on that ID.


Title: Re: EasyUI 1.4 ScrollView DetailFormatter Index
Post by: jarry on September 03, 2014, 06:20:00 PM
Please visit this example http://www.jeasyui.com/tutorial/datagrid/datagrid28_demo.html. It works fine.


Title: Re: EasyUI 1.4 ScrollView DetailFormatter Index
Post by: graveytrain on September 05, 2014, 10:02:17 PM
No that one works because you are calling putting the entire table in the detailFormatter.  If you are using for instance

return '<div style="padding:2px"><table id="tt-' + index + '"></table></div>';

then calling the function to create tt

$('#tt-' + index).datagrid()

Then it will not work because it has the incorrect index.  So thanks for the quick reply, I hope this better explains the issue.  the index in scrollview resets itself to 0.  I used logging to verify.


Title: Re: EasyUI 1.4 ScrollView DetailFormatter Index
Post by: jarry on September 06, 2014, 03:03:22 AM
How do you use the 'detailFormatter' function? Please provide more code snippets you are used to demonstrate your issue.


Title: Re: EasyUI 1.4 ScrollView DetailFormatter Index
Post by: graveytrain on September 06, 2014, 07:49:32 AM
So I use detail formatter to place a div, and I use expand row to call and get my data to fill the row.  but what I discovered if I put an alert in the onExpandRow is that the row index would start back at 0 when scrollview was in play. and it caused me some headaches.  finally I added a unique ID in my data which was a good work around but here is the offending code

detailFormatter: function(index, data){
                  
                  return '<div style="padding:2px"><table id="tt-' + index + '"></table></div>';
               },
               onExpandRow: function(index,row){
                  $('#tt-'+index).datagrid({
                     url:'./scripts/subcong.php?date='+$('#td').datebox('getValue')+'&nodeid='+row.nodeid+'&table='+table,
                     fitColumns:false,
                     singleSelect:true,
                     autoRowHeight:false,
                     height:'auto',
                     scrollsize:0,
                     columns:[[
                     {field:'nodeid',title:'Nodeid',width:127, sortable:true},
                     {field:'1',title:'1',width:45, styler:styler100200, sortable:true},
                     {field:'2',title:'2',width:45, styler:styler100200, sortable:true},
                     {field:'3',title:'3',width:45, styler:styler100200, sortable:true},
                     {field:'4',title:'4',width:45, styler:styler100200, sortable:true},
                     {field:'5',title:'5',width:45, styler:styler100200, sortable:true},
                     {field:'6',title:'6',width:45, styler:styler100200, sortable:true},
                     {field:'7',title:'7',width:45, styler:styler100200, sortable:true},
                     {field:'8',title:'8',width:45, styler:styler100200, sortable:true},
                     {field:'9',title:'9',width:45, styler:styler100200, sortable:true},
                     {field:'10',title:'10',width:45, styler:styler100200, sortable:true},
                     {field:'11',title:'11',width:45, styler:styler100200, sortable:true},
                     {field:'12',title:'12',width:45, styler:styler100200, sortable:true},
                     {field:'13',title:'13',width:45, styler:styler100200, sortable:true},
                     {field:'14',title:'14',width:45, styler:styler100200, sortable:true},
                     {field:'15',title:'15',width:45, styler:styler100200, sortable:true},
                     {field:'16',title:'16',width:45, styler:styler100200, sortable:true},
                     {field:'17',title:'17',width:45, styler:styler100200, sortable:true},
                     {field:'18',title:'18',width:45, styler:styler100200, sortable:true},
                     {field:'19',title:'19',width:45, styler:styler100200, sortable:true},
                     {field:'20',title:'20',width:45, styler:styler100200, sortable:true},
                     {field:'21',title:'21',width:45, styler:styler100200, sortable:true},
                     {field:'22',title:'22',width:45, styler:styler100200, sortable:true},
                     {field:'23',title:'23',width:45, styler:styler100200, sortable:true},
                     {field:'24',title:'24',width:45, styler:styler100200, sortable:true},
                     {field:'25',title:'offpeak',width:50, styler:styler200400, sortable:true},
                     {field:'26',title:'onpeak',width:46, styler:styler200400, sortable:true}
                  ]],


Title: Re: EasyUI 1.4 ScrollView DetailFormatter Index
Post by: jarry on September 06, 2014, 03:54:43 PM
Please try to select the datagrid by class instead of id.
Code:
$('#tt').datagrid({
data:rows,
detailFormatter: function(index, row){
return '<div style="padding:2px"><table class="dg"></table></div>';
},
onExpandRow: function(index, row){
$(this).datagrid('getRowDetail',index).find('table.dg').datagrid({
columns:[[
{field:'nodeid',title:'Nodeid',width:127}
]]
})
}
});

Or download the updated scroll view from http://www.jeasyui.com/extension/datagridview.php


Title: Re: EasyUI 1.4 ScrollView DetailFormatter Index
Post by: graveytrain on September 06, 2014, 04:56:29 PM
That worked also.  thanks for the help.