How to display two grids using EXTJS

[surya_dks]

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();
});

[Norm]

This looks like javascript. You might get better help on a javascript forum.

[Supamagier]

It IS JavaScript. Sorry, can't help ya.

[venkateshaare]

Just now I entered in to java development team.


Right now I am just checking posted questions.It was very good.Sure I will start posting.


Thanks,
Venkatesh Aare