Setting dhtmlx tabbar label width after creation

I know the width of a label can be set on creation, like this:

tabbar.addTab(…, …, size);



Through a small calculation of the label’s text I’ve made the width somewhat dynamic, I make it wider depending on the length of the label’s text.



However now I find myself wanting to change the text during runtime.

Luckily you’ve made this easy to do through the “setLabel” function.



However I haven’t been able to find a way to edit the tab’s width during runtime so I can adjust it to it’s new label.

Is there any way to edit the width of a label during runtime?



Thanks in advance,



Sander Verkuijlen, Estate Internet B.V.

Through a small calculation of the label’s text I’ve made the width somewhat dynamic
You can define size as “*” - it will result in auto-size to text length

>>However I haven’t been able to find a way to edit the tab’s width during runtime so I can adjust it to it’s new label.
There is no public method , but next can be used

tabbar.adjustTabSize(tabbar.tabsId[ID],SIZE);
tabbar._redrawRow(tabbar.rows[0]);

where ID - id of tab
SIZE - (integer) new size

if SIZE not defined, tab will be resized to fix label text


Many thanks for your quick response, defining the size of the label as “" on creation is working perfectly.



However the other solution you have provided isn’t quite working. It only makes the label’s width larger, regardless of the new label’s length. Even when I replace a long text with a shorter one, the label will grow instead of shrink.



I’m using the following code to change the tab and it’s label:



tabbar.forceLoad(id, href);   //Refreshing the tab, or loading new content
tabbar.setLabel(id, tekst);   //Setting the tab’s new label text (tekst is a string)




//And here is the fix you provided, I’ve also tried it with "
” and an undefined variable instead of NULL, but the result is the same.
tabbar.adjustTabSize(tabbar.tabsId[id],null); 
tabbar._redrawRow(tabbar.rows[0]);



Thanks in advance,

Sander Verkuijlen, Estate Internet B.V.

The code above really resize to bigger value only. To have it work in both sides, it need to be changed as

tabbar.adjustTabSize(tabbar.tabsId[id],10); //set minimal
tabbar.adjustTabSize(tabbar.tabsId[id],null); //autosize
tabbar._redrawRow(tabbar.rows[0]);

Sample attached.

1225795116.zip (80.9 KB)


I’ve tried to implement the solution you provided but the change results in a javascript error, “Invalid Argument” on line 93 of dhtmlxtabbar.js (compressed file, for you the line number will be different).



The dhtmlxtabbar.js file I’m using is of the following build:  v.2.0 build 81009



When selecting the option to debug with Visual Studio 2008 it points to the following piece of code.



tab.childNodes[2].style[this._vMode?“height”:“width”]=size-nss[8]-nss[7]+“px”



Should I include the dhtmlxtabbar.js file that was provided with the sample (the sample is working fine) or would this be a downgrade from the files I have purchased?

The file in sample is also taken from dhtmlxtabbar.js 2.0 , just not compressed version.
Please try to increase next value
tabbar.adjustTabSize(tabbar.tabsId[id],10);


Based on used skin, min value may differ. If it will be two small, the code calculates negative width, which may cause such error in IE.


That solved the problem, many thanks!