Start Building Professional
Web Apps Today

add anothergrid as innerHtml for particular row

i'm using dhtmlxgrid

my problem is that i need another dhtmlxgrid in parent grid when i select any row on parentgrid.
this child grid will be open just next to parentgrid.and there will be option to close child grid and show parent grid.

for earch child grid i have to call serveraction that will return list object and i have to print that list in child grid.


It's very urgent.Please provide me sample example for it as soon as possible.

There are three possible solution
a) use sub-grid functionality 
http://dhtmlx.com/docs/products/dhtmlxGrid/samples/extended_modes/pro_subgrids.html?un=1229080206000
b) use grid as cell editor
http://dhtmlx.com/docs/products/dhtmlxGrid/samples/interaction_other_components/pro_linked_grid.html?un=1229080236000
ñ) you can use onRowSelect event to catch moment when row in parent grid selected and show some custom container with second grid, which can be loaded with data according to selected row. 

i'm using

ParentGrid as mygrid

function doInitGridForCreate(){

 mygrid = new dhtmlXGridObject('mygrid_container');
//mygrid.enablePaging(true,10,2,"pagingArea",true,"recInfoArea");
//mygrid.enableAutoHeigth(true,"400");
 mygrid.setImagePath("images/");
mygrid.setHeader("Select All, ,img:[codebase/imgs/flag.gif],Sr.No.,ID No.,PartNo.,QTY.,Amount,Suppl.Name,Facility,Buyer,First Delivery");
mygrid.attachHeader("#master_checkbox");
mygrid.enableAutoHeight(false);
mygrid.enableAutoWidth(true);

mygrid.setInitWidths("50,30,30,100,100,100,60,60,100,100,100,100");
mygrid.setColTypes("ch,ro,ro,ro,ro,ro,ro,price,ro,ro,ro,ro");
mygrid.setColAlign("left,center,right,center");
mygrid.setColSorting(" , ,str,int,str,int,int,int,str,str,str,date");

mygrid.setSkin("MWB2");
mygrid.attachEvent("onRowSelect", test);
mygrid.init();
for(P = 1; P<=4; P++){
mygrid.addRow(P,"0,first ,<img src='codebase/imgs/flag.gif'/>,001,<a href='samplenew.htm'>MWB2_111505051</a>,0588417Z01,200,2000,Flextronics,Sch,Lee Jones,8/6/2008");

}

}

 

 

and child grid as cGrid

 

var cGrid;
 function childGrid(myData){
  
  cGrid = new dhtmlXGridObject('alternateSupplierDIV');

   cGrid.setImagePath("images/");
  cGrid.setHeader("Buyer Action,Buyer");
  
  cGrid.enableAutoHeight(true);
  cGrid.enableAutoWidth(true);

  cGrid.setInitWidths("100,100");
  cGrid.setColTypes("ro,ro");
  //cGrid.setColAlign("left,center");
  //cGrid.setColSorting(" , ,str,int,str,int,int,int,str,str,str,date");

  cGrid.setSkin("MWB2");
  mygrid.setSubGrid(cGrid,1,0);

  cGrid.init();
  var i=0;
  
  for(var t=0;t<myData.length;t=t+2){
   
   i=i+1;
   var first=myData[t];
   var second=myData[t+1];
   var first=first+','+second;
   cGrid.addRow(i,first);
  }

 
}

 

 

and on rowselect i call

function test(){

childGrid(myData);

}

 

i'm using (mygrid.setSubGrid(cGrid,1,0);) in child grid it is not working please provide me solution for this

Please provide me solution for my query

i have define div at the bottom of my jsp.......so the child gid is open at the bottom not at cloumn 1.Please suggest me solution it's very urgent

 <div id="alternateSupplierDIV" "width=100%"   height="250px" align="left" >
</div>

If you need just to show some sub-grid - you need not use   setSubGrid(cGrid,1,0);
setSubGrid functionality used for creating linked grids, which based on special column type 
In your case, you can replace setSubGrid command with some custom js code which will made alternateSupplierDIV container visible.

if i want to attach subGrid with parent grid's any column how can i do that....

i need when i click on that cell i call my test function from where i'm creating subgrid.

so where i have to define container of subgrid?

 subgrid = new dhtmlXGridObject('gridbox_sub');
means where i have to define div gridbox_sub
 
provide solution

OR can u provide me js code to visible alternatesupplier Div when child grid is created that alternatesupplier div shuld visble at parent grid's first column

Please check attached sample

thanx for sending that sample.

But now i want to sorting in subgrid.But when i click on that grid it will close.cant able to sort that.

Please provide solution for that as soon as possible.