You probably have a grid with a lot of rows and/or columns and set forceFit or autoResizeColumn.
Either don't use forceFit/autoResizeColumn or try to reduce the amount of rows by using a paging toolbar (or use the LiveGrid extension).
You probably have a grid with a lot of rows and/or columns and set forceFit or autoResizeColumn.
Either don't use forceFit/autoResizeColumn or try to reduce the amount of rows by using a paging toolbar (or use the LiveGrid extension).
The following html used in conjunction with this plugin can make many problems associated with embedding an Ext.Panel into a percentage width/height element (table/div/etc) go away:
HTML Code:<div style="position:relative; width: 100%; height: 100%;"> <div id="mainContainer" style="overflow: hidden; position: absolute; width: 100%; height: 100%; top: 0; left: 0;"/> </div>
I modify the plugin for configure the adjust manually in some cases:
Example of usage:Code:Ext.namespace('Ext.ux.plugins'); Ext.ux.plugins.FitToParent = function(parent, width, height) { return { init: function(c) { c.on('render', function(c) { parent = Ext.get(parent || c.el.dom.parentNode); }); c.monitorResize = true; c.doLayout = c.doLayout.createInterceptor(function(){ var pos = this.getPosition(), size = parent.getViewSize(); var w = width || pos[0]; var h = height || pos[1]; this.setSize(size.width - w, size.height - h); }, c); c.on('resize', function(c){ c.doLayout(); }); } } }
Greetings,Code:new Ext.ux.plugins.FitToParent(null, null, 48)
If I remove this line not work properly in my case, When resize west panel in www.galdaka.es
Thanks for your reply,
Another question. In west panel I have a "SeacrhField"; Is posible resize the field when the west panel is resized with your plugin?
Thanks in advance,
I was having problems. Passing the document body has the parent fixed it:
Code:new Ext.Panel({ layout: 'border', renderTo:'viewPort', plugins: [new Ext.ux.plugins.FitToParent(Ext.getBody())], ...
I'm having problems trying to get this work.
I have a div with : width: 100%.
I renderTo the grid in.
But the grid gets a wrong width (getting out the screen !!!)
Can someone please give an example of the code and the html used to have a grid fit 100% width of a non-Extjs container ? (ex. a div)
Did you set the div to overflow:hidden?