Row height and edit text location

Suite and Optimus Suite 5
#1

Hi there. I’m evaluating dhtmlxGrid and I’m running into issues.

  1. I can’t seem to set the height of my rows to something short. One of the values is many lines long, so the row height is pushed longer. I’d like to set the row height to always be 200px, or to have a maximum of 200px. Is this possible?

  2. When I assign a column to edit type “txt”, clicking on a cell in that column shows an edit box all the way at the bottom of the screen instead of next to the object. How can I draw it next to the object?

Here is my code:

[code]



var myGrid;

		myGrid = new dhtmlXGridObject('gridbox');
		myGrid.setImagePath("/codebase/imgs/");
		myGrid.setHeader(",Title,....");
		myGrid.setColTypes("ro,ed,ed,ed,ro,ed,ed,ed,ro,ed,txt,ed,ro,ed,ed,ed,ro,ed,ed,ed,ro,ed,ed,ed,ro,ed,ed,ed,ed"); 
		 myGrid.setInitWidths("100,100,100,100,100,100,100,100,100,100,100,100,100,100,100,100,100,100,100,100,100,100,100,100,100,100,100,100,100");          //the widths of columns  
		myGrid.enableMultiline(true);
		myGrid.enableEditEvents(true,true,true);
		myGrid.setStyle ("font-family:\"helvetica neue\"", "height:200px;font-family:\"helvetica neue\";vertical-align:top;height:200px;overflow:hidden;", "height:200px;overflow:hidden;", "height:200px;overflow:hidden;");			
		myGrid.attachEvent("onEditCell",function(stage,id,index,value,old_value){
			 if (value != old_value && stage==2) functionCall(...)
		});
		
		myGrid.init();
		myGrid.splitAt(2);

data={ rows: [
{ id: 1, data: […]},
{ id: 2, data: […]}
]};
myGrid.parse(data,“json”);
[/code]

Thanks for the help!

#2

  1. You may use the following css:
    div.gridbox_dhx_terrace.gridbox table.obj.row20px tr td{
    height:200px;
    line-height: 200px;
    }
    Please, note that you need to disable the multiline mode.

  2. Please, try to use the following code:
    myGrid.attachEvent(“onEditCell”, function(stage,rId,cInd,nValue,oValue){
    if(stage==1 &&this.editor.obj) {
    var edit_box=document.getElementsByClassName(‘dhx_textarea’)
    var arPos = this.getPosition(this.cell);
    edit_box[0].style.left=arPos[0]+this.getColWidth(cInd)-20+“px”;
    edit_box[0].style.top=arPos[0]-12+“px”;
    }
    return true;
    });