1. #1
    Ext JS Premium Member AndreTheDiminutive's Avatar
    Join Date
    Dec 2008
    Posts
    114
    Vote Rating
    0
    AndreTheDiminutive is on a distinguished road

      0  

    Question How to invoke show/hide checkbox control from button versus header

    How to invoke show/hide checkbox control from button versus header


    Hi, for the Ext 2.2 grid, I'm trying to invoke the show/hide columns checkbox control from a button instead of within the header (please see screen shot).

    Access to this control can be toggled on/off with enableHdMenu.

    Where is this code located and what parameters do I need to pass to it? I understand that it manipulates the ColumnModel but don't want to reinvent the wheel since this already does exactly what I need it to...just need to invoke it from a different place.

    Thanks!
    Attached Images

  2. #2
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,251
    Vote Rating
    73
    Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold

      0  

    Default


    Use:
    Code:
    grid.getColumnModel().setHidden(colIndex, hidden);

  3. #3
    Ext JS Premium Member AndreTheDiminutive's Avatar
    Join Date
    Dec 2008
    Posts
    114
    Vote Rating
    0
    AndreTheDiminutive is on a distinguished road

      0  

    Default


    Quote Originally Posted by Condor View Post
    Use:
    Code:
    grid.getColumnModel().setHidden(colIndex, hidden);
    Thanks, Condor.

    I've got that part figured out.

    I was hoping to re-use the pop-up with the column names & check boxes.

    ...do you know where this code lives?

  4. #4
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,251
    Vote Rating
    73
    Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold

      0  

    Default


    Try:
    Code:
    var view = grid.getView();
    view.colMenu = new Ext.menu.Menu({
    	listeners: {
    		beforeshow: view.beforeColMenuShow,
    		itemclick: view.handleHdMenuClick,
    		scope: view;
    	}
    });
    var button = new Button({
    	text: 'Columns',
    	menu: view.colMenu
    });

  5. #5
    Ext JS Premium Member AndreTheDiminutive's Avatar
    Join Date
    Dec 2008
    Posts
    114
    Vote Rating
    0
    AndreTheDiminutive is on a distinguished road

      0  

    Default


    My lack of javascript knowledge is killing me, sorry!

    I was actually hoping to invoke this from a button in the grid (see second code snippet).

    Pasting your code into the bottom of my file gives me an error 'Button is not defined'.

    Code:
     
    var grid4 = new xg.GridPanel({
     //       id:'button-grid',
              store: ds,
              colModel: getColumnModel(),
              autoExpandColumn: 'history',
              viewConfig: {
              forceFit:true
              },
            // inline buttons
     //       buttons: [{text:'Save'},{text:'Cancel'}],
    //        buttonAlign:'center',
            // inline toolbars
              tbar:[{
                text:'Add/Remove Columns',
                tooltip:'Add or or remove columns from this view',
                iconCls:'add'
     //           menu: view.colMenu
            }
        ],
            width:1000,
            height:300,
            frame:true,
            stripeRows:true,
            collapsible:true,
            enableHdMenu:false,
            title:'Controller Information',
            renderTo: document.body
        });
        var view = grid4.getView();
        view.colMenu = new Ext.menu.Menu({
     listeners: {
        beforeshow: view.beforeColMenuShow,
        itemclick: view.handleHdMenuClick,
        scope: view
        }
    });
     var buttoni = new Button({
       text: 'Columns',
       menu: view.colMenu
    });
    });
    Putting the getView() code inside the grid creation gives me an 'invalid property id' error for 'var view = grid4.getView();

    Code:
    var grid4 = new xg.GridPanel({
     //       id:'button-grid',
            store: ds,
            colModel: getColumnModel(),
            autoExpandColumn: 'history',
            viewConfig: {
                forceFit:true
            },
             var view = grid4.getView();
             view.colMenu = new Ext.menu.Menu({
         listeners: {
      beforeshow: view.beforeColMenuShow,
      itemclick: view.handleHdMenuClick,
      scope: view
     }
    });
            // inline buttons
     //       buttons: [{text:'Save'},{text:'Cancel'}],
    //        buttonAlign:'center',
            // inline toolbars
            tbar:[{
                text:'Add/Remove Columns',
                tooltip:'Add or or remove columns from this view',
                iconCls:'add'
                menu: view.colMenu
    //           iconCls:'remove'
            }
        ],
            width:1000,
            height:300,
            frame:true,
            stripeRows:true,
            collapsible:true,
            enableHdMenu:false,
            title:'Controller Information',
       //     iconCls:'icon-grid',
            renderTo: document.body
        });

  6. #6
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,251
    Vote Rating
    73
    Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold Condor is a splendid one to behold

      0  

    Default


    Yes, you really need to learn more about javascript...

    Try:
    Code:
    var view = new Ext.grid.GridView({
    	forceFit: true
    });
    view.colMenu = new Ext.menu.Menu({
    	listeners: {
    		beforeshow: view.beforeColMenuShow,
    		itemclick: view.handleHdMenuClick,
    		scope: view
    	}
    });
    var grid = new Ext.grid.GridPanel({
    	...
    	enableColumnHide: false,
    	view: view,
    	tbar: [{
    		text:'Add/Remove Columns',
    		menu: view.colMenu
    	}]
    });

  7. #7
    Ext JS Premium Member AndreTheDiminutive's Avatar
    Join Date
    Dec 2008
    Posts
    114
    Vote Rating
    0
    AndreTheDiminutive is on a distinguished road

      0  

    Default


    Thanks once again Condor!

    It is perfect.

    My brute force approach (12-18 hr days, 7 days/wk) will doubtless aid in getting me up to speed with javascript & Ext...having the support of the Ext community (which rocks!) will get me there faster.

Thread Participants: 1

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