1. #1
    Sencha User
    Join Date
    Jan 2012
    Posts
    11
    Vote Rating
    0
    kamalraj is on a distinguished road

      0  

    Default Setting gridpanel forceFit to false dynamically.

    Setting gridpanel forceFit to false dynamically.


    I am using ExtJs 3.3.2

    On creation of the grid I have used


    viewConfig: {
    forceFit:true
    }

    and changed the forcefit dynamically as (this is because to get the horizontal scroll bar)


    grid.getView().forceFit = false;

    but the grid forceFit is not set to false. But while doing this vise-versa, i.e setting the forceFit to false initially and changed that dynamically to true is working fine. I have attached a sample file PFA[gridpanel1.html]
    Attached Files

  2. #2
    Sencha - Community Support Team sword-it's Avatar
    Join Date
    May 2012
    Location
    Istanbul
    Posts
    1,332
    Vote Rating
    83
    sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough

      0  

    Default


    Hi,

    You need to use grid.getView().forceFit = true for your second colModel (colModel2). Because colModel2's width is greater than window width.

    Code:
    function refreshGrid() {
            var grid = Ext.getCmp('gridLst');
            var gridstore = grid.getStore();
    
    
            console.log('Referesh Grid');
            if (flag == 1) {
                grid.getView().forceFit = true;// not false
                grid.reconfigure(GpStore2, colModel2);
                flag = 2;
            } else if (flag == 2) {
                grid.getView().forceFit = false;//not true
                grid.reconfigure(GpStore1, colModel1);
                flag = 1;
            }
    }
    sword-it.com, Sencha Developer House in Turkey - Istanbul University Technopark Suite 204.

  3. #3
    Sencha User
    Join Date
    Jan 2012
    Posts
    11
    Vote Rating
    0
    kamalraj is on a distinguished road

      0  

    Default Override to solve the issue

    Override to solve the issue


    Hi,

    Use this override to fix the issue,

    Code:
    Ext.override(Ext.grid.GridView, {
        layout : function() {
            if(!this.mainBody) {
                return;
            }
            var mygrid     = this.grid,
                mygridEl   = mygrid.getGridEl(),
                colmodel   = this.cm,
                expandCol  = mygrid.autoExpandColumn,
                mygridview = this,
                csize      = mygridEl.getSize(true),
                vw         = csize.width;
            
            if(vw < 20 || csize.height < 20){
                return;
            }
            
            if(mygrid.autoHeight){
                csize.height = mygridview.mainHd.getHeight() + mygridview.mainBody.getHeight();
                if (!mygridview.forceFit) {
                    csize.height += mygridview.scrollOffset;
                }
            }
            mygridview.el.setSize(csize.width, csize.height);
            var hdHeight = mygridview.mainHd.getHeight();
            var vh = csize.height - (hdHeight);
            mygridview.scroller.setSize(vw, vh);
    
    
            if(mygridview.innerHd){
                mygridview.innerHd.style.width = (vw)+'px';
            }
    
    
            if(mygridview.forceFit) {
                if(mygridview.lastViewWidth != vw) {
                    mygridview.fitColumns(false, false);
                    mygridview.lastViewWidth = vw;
                }
            } else {
                mygridview.autoExpand();
            }
            mygridview.onLayout(vw, vh);
        }
    });
    while applying this override, I faced another issue in Internet Explorer.
    ISSUE: After applying this override, if any row is mouse overed, grid height is getting increased in IE.

    To solve this, please add the following code before reconfiguring the grid with new set of columns.

    Code:
    if (Ext.isIE) {
    // taskGrid is the grid component
    if (Ext.isIE) {    var body = taskGrid.getView().grid.el.select('.x-grid3-body').first();
        var height = taskGrid.getView().grid.getGridEl().getHeight() - taskGrid.getView().scroller.getHeight() + body.getHeight();
        taskGrid.getView().grid.getGridEl().setHeight(height + 20);
        taskGrid.getView().scroller.setStyle({
            overflow: 'auto'
        });
        taskGrid.getView().grid.autoHeight = false;
        taskGrid.getView().layout();
        taskGrid.getView().grid.autoHeight = true;
    }
    This will solve the issue in both the browsers.

Thread Participants: 1

Tags for this Thread

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar