PDA

View Full Version : Incorrect Column Header width in treeGrid



CrazyHob
28 Dec 2010, 4:15 AM
Hello.

I'm initializing tree grid this way:


var treeGrid = new Ext.ux.tree.TreeGrid({
title: 'Core Team Projects',
height:400,
autoWidth: true,
enableDD: true,
enableSort: false,
columns:[{
header: 'Request number',
dataIndex: 'taskid',
width:100
},{
header: 'Priority',
dataIndex: 'pr',
width: 50
},{
header:'Title',
dataIndex: 'name',
width: 230
},{
header: 'Description',
width: 450,
dataIndex: 'description'
},{
header: 'Commment',
width: 450,
dataIndex: 'comment'
},{
header:'client',
width: 150,
dataIndex: 'client'
}],
listeners:{
contextmenu:function(node, eventObj){
eventObj.stopEvent();
activeGroupId = node.id;
GroupContextMenu.show(node.getUI().wrap);

}
},
//dataUrl: 'gettaskgrouptree.action'
dataUrl: 'dummydata.json'
});


Here comes data:

[{"children":[{"cat":"","cdate":"30.09.2010","client":"","comment":"?????? ??? ???????????? ??????????? ??????? ???????????? ?????????? ????????","iconCls":"task","id":29878,"leaf":true,"module":"","name":"???????? ??????? ???????????? ??????????","oldate":"","olworker":"","pr":"HIGH","priorts":"","prvalue":2,"status":"","taskid":"53157","worker":""},{"cat":"","cdate":"30.09.2010","client":"","comment":"?????? ??? ???????????? ??????????? ??????? ???????????? ?????????? ????????","iconCls":"task","id":29877,"leaf":true,"module":"","name":"???????? ??????? ???????????? ??????????","oldate":"","olworker":"","pr":"HIGH","priorts":"","prvalue":2,"status":"","taskid":"53157","worker":""}],"cls":"master-task","description":"SOme dummy dsicription jus tot sort things out","iconCls":"task-folder","id":29875,"leaf":false,"name":"Some test gourp num 3"},{"children":[],"cls":"master-task","description":"Some test dummy discription for test group 2","iconCls":"task-folder","id":29835,"leaf":true,"name":"Some Test Group 2"},{"children":[],"cls":"master-task","description":"Test group dummy discription","iconCls":"task-folder","id":29834,"leaf":true,"name":"Test Group"}]
And shot of the problem.
http://img502.imageshack.us/img502/143/screenxk.jpg
As you can see columns have correct width... but not headers!!! I have to resize one of them to get correct sizes. How come? How can I fix it?

By the way Ext JS version used is 3.1.0

Condor
28 Dec 2010, 4:18 AM
Do not use autoWidth:true. Either give it a fixed 'width' or have the container of the tree size the component using it's layout.

CrazyHob
28 Dec 2010, 4:38 AM
It works great by romoving autoWidth property from constructor.

THX for you guidance, Condor.

ExtGuy
2 Sep 2013, 2:42 AM
I have the same problem in ExtJS 3.4.1.1.
Also the column width is correct, the header width however is just as wide as the header text itself.
I am not using autoWidth and setting it to false did not resolve the issue.

As a workaround I call the updateColumnWidths method of the TreeGrid after the component has rendered:


listeners:{
scope:this
,afterRender: function(me){
me.updateColumnWidths();
}
}