ExtJS Repositioning/resizing toolbar on window resize -

i have toolbar inside simple container. rendered on window's div. when resize window toolbar remains stationary. if window gets smaller toolbar starts disappearing (overflowing outside). if window gets bigger toolbar stays in position instead of trying remain far right started. i've tried resize , enable overflow configs nothing seems work. i'm thinking positioning through div might problem i'm not sure how test or fix that. ideas?

some sample code:

var toolbar = ext.create('mytoolbar'); var toolbarcontainer = ext.create('widget.contaienr', {renderto: 'mydiv', items: [toolbar]}); . . . <div id='mydiv'></div> 

check function in extjs docs

onwindowresize( fn, scope, [options] ) 

adds listener notified when browser window resized , provides resize event buffering (100 milliseconds), passes new viewport width , height handlers.

example code looks below(i guess have write in afterrender .(you have add event , fire it.)) adding event in init component looks below

this.addevents('setinboxtilesource'); 

firing event in afterrender looks below

ext.eventmanager.onwindowresize(function (w, h) {     this.fireevent('browser_window_resize') }, this, {buffer: 150}); 

you have listen event , set width , height toolbar.

listeners: {      browser_window_resize: this.handleresize,      scope: }  handleresize:function(){        this.setheight(ext.getbody().getviewsize().height - 270);     this.setwidth(ext.getbody().getviewsize().width- 100); } 

hope helps you...