C# Web Application - Top DataGrid overlapped with bottom datagrid after databinding

I have another idea to use java script that is copied from others. But I don't know how to pass the parameters from .net to javascript.

I don't know whether Session can do it or not or using cookie.


 // Move Objects (19-Jan-2006) // by Vic Phillips http://www.vicsjavascripts.org.uk/ // zxcMoveTo('Tst1',400,300,4,50); // parameter 0 - the object or the ID of the object to move (object or string ID) // parameter 1 - the new Horizontal(X) position (digits) // parameter 2 - the new Vertical(Y) position (digits) // parameter 3 - optional the move increment (digits) // parameter 4 - optional the move delay (digits) var zxcCnt=0; var TO; function zxcMoveTo(zxcobj,zxcx,zxcy,zxcinc,zxcdly){ if (typeof(zxcobj)=='string'){ var zxcobj=document.getElementById(zxcobj); } if (!zxcobj.oop){ zxcobj.oop=new zxcOOPMove(zxcobj); zxcobj.oop.inc=zxcinc||1; zxcobj.oop.dly=zxcdly||100; } if (zxcobj.oop.stop){ zxcobj.oop.stop=false; } else { zxcobj.oop.stop=true; } zxcobj.oop.inc=zxcinc||zxcobj.oop.inc; zxcobj.oop.dly=zxcdly||zxcobj.oop.dly; clearTimeout(zxcobj.oop.to); zxcobj.spos=[zxcPos(zxcobj)[0],zxcPos(zxcobj)[1]]; zxcobj.fpos=[zxcx,zxcy]; zxcobj.style.position='absolute'; zxcobj.style.left=zxcobj.spos[0]+'px'; zxcobj.style.top=zxcobj.spos[1]+'px'; if (Math.abs(zxcobj.fpos[0]-zxcobj.spos[0])>Math.abs(zxcobj.fpos[1]-zxcobj.spos[1])){ zxcobj.xr=1; zxcobj.yr=Math.abs(zxcobj.fpos[0]-zxcobj.spos[0])/Math.abs(zxcobj.fpos[1]-zxcobj.spos[1]); } else { zxcobj.yr=1; zxcobj.xr=Math.abs(zxcobj.fpos[1]-zxcobj.spos[1])/Math.abs(zxcobj.fpos[0]-zxcobj.spos[0]); } zxcObj=zxcobj; zxcobj.xpol=1; zxcobj.ypol=1; if (zxcobj.fpos[0]0)||(parseInt(this.obj.style.left)>this.obj.fpos[0]&&this.obj.xpol<0)){ this.setTimeOut("move();",this.dly); } else { this.obj.style.left=(this.obj.fpos[0])+'px'; this.obj.style.top=(this.obj.fpos[1])+'px'; this.obj.lock=false; } } zxcOOPMove.prototype.setTimeOut=function(zxcf,zxcd){ this.to=setTimeout("window."+this.ref+"."+zxcf,zxcd); } function zxcPos(zxc){ zxcObjLeft = zxc.offsetLeft; zxcObjTop = zxc.offsetTop; while(zxc.offsetParent!=null){ zxcObjParent=zxc.offsetParent; zxcObjLeft+=zxcObjParent.offsetLeft; zxcObjTop+=zxcObjParent.offsetTop; zxc=zxcObjParent; } return [zxcObjLeft,zxcObjTop]; } /* zxcMoveTo('pnlProcedure',80, 50,1,3); zxcMoveTo('pnlInstruction',80,1000,1,2); zxcMoveTo('pnlRecord',80,2000,1,1); */ /* alert('In testing mode'); alert('Pixel Height: ' + pnlProcedure.style.pixelHeight); alert('Height: ' + pnlProcedure.style.height); alert('Pos Height: ' + pnlProcedure.style.posHeight); alert('Offset Height: ' + pnlProcedure.style.offsetHeight); alert('Scroll Height: ' + pnlProcedure.style.scrollHeight); alert('Client Height: ' + pnlProcedure.style.clientHeight); */

I have found the solution by myself.

The solution is as follows:

## The commended code can find the panel or datagrid css elements

   // The Style property of the MyText control returns
   // a CssStyleCollection object.
//   IEnumerator keys = this.pnlProcedure.Style.Keys.GetEnumerator();
//
//   while (keys.MoveNext())
//   {
//    String key = (String)keys.Current;
//    String valuee = (String)pnlProcedure.Style[key];
//    Response.Output.Write("");
//   }

   //Response.Output.Write("");

######
Then at the pageload, Use the dataset.tables.rows.count as the offset then mutiple the row width
######

   int intProcedureHeight = this.mb_objDataSet.Tables["tabProcedureDICA"].Rows.Count * 40;
   int intInstructionHeight = this.mb_objDataSet.Tables["tabInstructionDI"].Rows.Count * 50 + intProcedureHeight + 50;
   this.pnlInstruction.Style["Top"] = intProcedureHeight.ToString();
   this.pnlRecord.Style["Top"] = intInstructionHeight.ToString();