|
How to display two grids using EXTJS
Hi,
How to display two grids in the same jsp using extjs library. I have written some code for displaying the first grid, but on click of a row in the first grid, I need to display the second grid like the attached screen shot. I am not getting any idea for how to get the second one. Can some body help me please its very urgent(if possible please give me the code for that.).
here is the code for first grid
function onFunctionLoad(){
Ext.onReady(function(){
var x=eval(request.responseText);
var myData = x;
var store = new Ext.data.SimpleStore({
fields: [
{name: 'userid'},
{name: 'WorkType'},{name: 'Building'},
{name: 'Floor'},{name: 'Space'},{name: 'WorkType Status'}
]
});
store.loadData(myData);
var grid = new Ext.grid.GridPanel({
store: store,
columns: [
{id:'userid',header: "userid", width: 160, sortable: true, dataIndex: 'userid'},
{header: "WorkType", width: 75, sortable: true, dataIndex: 'WorkType'},
{header: "Building", width: 75, sortable: true, dataIndex: 'Building'},
{header: "Floor", width: 75, sortable: true, dataIndex: 'Floor'},
{header: "Space", width: 75, sortable: true, dataIndex: 'Space'},
{header: "WorkType Status", width: 75, sortable: true, dataIndex: 'WorkType Status'}
],
stripeRows: false,
autoExpandColumn: 'userid',
sm: new Ext.grid.RowSelectionModel({
singleSelect: true,
listeners: {
rowselect: function(sm, row, rec) {
selectedVal=row;
}
}
}),
height:250,
width:500,
title:'Direct Reports'
});
grid.render('grid-example');
grid.getSelectionModel().selectFirstRow();
});
|