1. #1
    Sencha User
    Join Date
    Mar 2012
    Posts
    2
    Vote Rating
    0
    nowrap is on a distinguished road

      0  

    Default Unanswered: Grid panel: Howto toggle fullscreen

    Unanswered: Grid panel: Howto toggle fullscreen


    Hello,
    i've a grid panel and added via tools a fullscreen button. The handler opens a new Ext.Window and has as item the grid itself. After clicking the button the grid is transfered to the window. But the window has scrollbars and is grown wider and higher.

    Do i need to override the calculated width and height for the fullscreen property or the show().maximize() function?

    And i've troubles to the transfer the grid back to it's old place and dimensions after closing the window. Within the beforehide event i've use the following code:
    Code:
    window.items.first().el.appendTo(Ext.get(grid.renderTo));
    window is the Ext.Window and grid the Ext.grid.Panel.

    The grid is placed to it's old position but the tools bar keeps it's width from the window and some buttons aren't rendered correctly anymore.

    Does someone have similiar problems solved or created another solution for a grid fullscreen toogling?

    Regards
    nowrap

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,154
    Vote Rating
    475
    Answers
    685
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    Can you please provide a small working example of what you are trying to achieve?

    Regards,
    Scott.

  3. #3
    Sencha User
    Join Date
    Mar 2012
    Posts
    2
    Vote Rating
    0
    nowrap is on a distinguished road

      0  

    Default


    I can provide the tools code sample from my grid:
    Code:
            tools: [{
                type: 'maximize',
                tooltip: 'Maximieren',
                handler: function(event, toolEl, panel) {
                    var win = new Ext.Window({
                        title: "Vollbild-Modus",
                        autoScroll: false,                
                        closeAction: 'hide',
                        constrainHeader: true,
                        resizable: false,
                        floatable: false,
                        items: [grid],
                        listeners: {
                            show: function(window, eOpts) {
                                grid.tools.maximize.hide();
                            },
                            beforehide: function(window, eOpts) {
                                console.log("beforehide");
                                window.items.first().tools.maximize.show();
                                window.items.first().el.appendTo(Ext.get(grid.renderTo));
                                //window.items.first().el.setWidth(500);
                                //window.items.first().el.repaint();
                            },
                            hide: function(window, eOpts) {
                                console.log("hide");
                            }
                        }
                    });
                    win.show().maximize();
                }
            }],
    The grid itself is part of an nonpublic ajax driven application. The variable grid contains the created Ext.grid.Panel.

    Does this info help?

Thread Participants: 1

Tags for this Thread