1. #1
    Sencha User
    Join Date
    Aug 2015
    Posts
    5
    Vote Rating
    0
    hsrivastava is on a distinguished road

      0  

    Default Answered: Grid panel filters on filter buttons in top toolbar.

    I have a window, grid panel, a top toolbar, paging and grid filters. Now by default grid filters are provided in column headers, which is working for me, but i want them in my toolbar with buttons like, By date, By Group, Search button, clear etc...I think I'll have to make my own custom code for this. Any other ideas?
    One thing more which I cannot find anywhere, ex- i click by date filter button, a new space should appear just under the toolbar, which will have filter textbox, and when this event happens the grid should shift down a bit depending on the height of new panel. so how to do this... plz help.

  2. Something like this: ?

    https://fiddle.sencha.com/#fiddle/sk6

  3. #2
    Sencha User
    Join Date
    Aug 2015
    Posts
    5
    Vote Rating
    0
    hsrivastava is on a distinguished road

      0  

    Default

    Untitled.png[ATTACH=CONFIG]remove[/ATTACH]

  4. #3
    Sencha User jdkhamba's Avatar
    Join Date
    Jul 2012
    Posts
    74
    Vote Rating
    7
    Answers
    13
    jdkhamba will become famous soon enough

      0  

    Default

    Something like this: ?

    https://fiddle.sencha.com/#fiddle/sk6

  5. #4
    Sencha User
    Join Date
    Aug 2015
    Posts
    5
    Vote Rating
    0
    hsrivastava is on a distinguished road

      0  

    Default

    ohh yes exactly like this...thanx a lot. sorry for late reply

  6. #5
    Sencha User
    Join Date
    Aug 2015
    Posts
    5
    Vote Rating
    0
    hsrivastava is on a distinguished road

      0  

    Default

    var myTopToolbar = new Ext.Toolbar({
    height: 40,
    layout: { type: 'vbox' },
    items: [
    {
    xtype: 'container',
    layout: { type: 'hbox' },
    items: [{
    xtype: 'button',
    text: 'By Name',
    cls: 'tooltopcss',
    handler: function ()
    {
    var me = this;
    me.up('myTopToolbar').down('#byNameText').show();

    }
    }, {
    xtype: 'button',
    text: 'By Email',
    cls: 'tooltopcss',
    handler: function ()
    {
    var me = this;
    me.up('myTopToolbar').down('#byEmailText').show();
    }
    }]
    }, {
    xtype: 'container',
    layout: { type: 'hbox' },
    items: [
    {
    xtype: 'textfield',
    hidden: true,
    itemId: 'byNameText'
    },
    {
    xtype: 'textfield',
    hidden: true,
    itemId: 'byEmailText'
    }]

    }
    ]
    });

    if I am using xtype: container, then it says, 'TypeError: a.setContainer is not a function', and only the window appears nothing else.
    if I use xtype:'toolbar' in place of container, window and grid etc are displayed, with only buttons toolbar, but not handler not even on clicking button. on button click msg- 'me.up is not a function'.

    I am using toolbar in grid, as:
    tbar: myTopToolbar

  7. #6
    Sencha User jdkhamba's Avatar
    Join Date
    Jul 2012
    Posts
    74
    Vote Rating
    7
    Answers
    13
    jdkhamba will become famous soon enough

      0  

    Default

    The reason me.up() and other componentQueries are not working is because there is no registered xtype called 'myTopToolbar'. You need to configure your toolbar with an alias in order to use that as follows:

    Code:
    var myToolBar = Ext.create('Ext.toolbar.Toolbar',{
    alias:'widget.myTopToolbar'});

Similar Threads

  1. Replies: 1
    Last Post: 16 Jun 2015, 2:08 PM
  2. [FIXED] Ext.grid.filters.filter.List not respecting documentation
    By nbourdeau in forum Ext 5: Bugs
    Replies: 2
    Last Post: 22 Nov 2014, 3:16 PM
  3. Can I bind options to Ext.grid.filters.filter.List?
    By khmurach in forum Ext 5: Q&A
    Replies: 1
    Last Post: 3 Nov 2014, 3:52 PM
  4. [FIXED] Ext.grid.filters.filter.Number keypress error
    By dfrederick in forum Ext 5: Bugs
    Replies: 1
    Last Post: 16 Jul 2014, 3:21 PM
  5. Grid filters example fails when date filter is set
    By ssamayoa in forum Ext: Discussion
    Replies: 2
    Last Post: 12 Sep 2011, 1:24 PM

Thread Participants: 1