Go to
http://www.flexigrid.info/
They have, on their example page, multiple grids on one page.
The part which you would need to do is onclick, to load the correct
details in the detail grid, which isn't that tough to do
{display: 'Order Date', name : 'Ord_OrderDate', width : 60,
sortable : true, align: 'left', process: openSendBox},
openSendBox (right after process) is a javascript function, this will
fire each time you select that column (you can do the same for all
columns so anywhere the person clicks on a row, it will fire)
In your custom function (this case, openSendBox) you will have:
function openSendBox(celDiv,id){
}
id is always the ID of the grid AFAIK, so if my first column is the
OrderID (for this example) then id is that unique ID as well, which
you then can use to get new data for the second grid and call
a .flexReload();