draw a cross line on the grid


Hi,



I’m want to draw draw a cross line on the grid to know location of cell the mouse overed, so, I create the followings code.



 



mygrid.attachEvent(“onMouseOver”,function(row_id,cell_id,e){
  
 if(cell_id>0){
   //row_id: TP012017
   var colsNum = mygrid.getColumnsNum();
   var disableColumns = mygrid.getUserData(row_id, “disable”);
   //mygrid.setSkin(“sds”);
     
   mygrid.forEachRow(function(id) {   
    for(i=1;i<colsNum;i++) {
     if(id == row_id){//current row id == selected row id
      if(disableColumns.indexOf(id)>-1){
       mygrid.setCellTextStyle(id,i,“background-color:#dedee3; background-image:url(/img/sds/bg_th5.gif);”);
      }       
      mygrid.setCellTextStyle(id, i, “border-bottom-width:2px;border-bottom-color:#545454;”);
     }
     else
     {//init of general cells
      mygrid.setCellTextStyle(id,i, “”);
     }
    }
    mygrid.setCellTextStyle(id, cell_id, “border-left-width:2px;border-left-color:#545454;”);
   }); 
   
   mygrid.setCellTextStyle(row_id,cell_id, “border-left-width:2px;border-left-color:#545454;border-bottom-width:2px;border-bottom-color:#545454;”);
   
 }
 });



 



But, Its speed is not good.



Do you have a great idea to enhance this speed or to know location of cell mouse overed?




help me…T_T;;;


You can enable light mouse navigation and change style for the selected cell and row:


mygrid.enableLightMouseNavigation(true);






div.gridbox table.obj tr.rowselected td{
border-bottom: 2px solid red;
}





div.gridbox table.obj tr.rowselected td.cellselected, div.gridbox table.obj td.cellselected {


border-bottom: 2px solid green;


}



If you have attached skin to your grid:


div.gridbox_skinName table.obj tr.rowselected td.cellselected, div.gridbox table.obj td.cellselected {


div.gridbox_skinName table.obj tr.rowselected td{




More information about grid’s appearance you can find here dhtmlx.com/docs/products/dhtmlxG … _cust_skin