1. #1
    Sencha User
    Join Date
    Jun 2011
    Posts
    52
    Vote Rating
    0
    won.rhee is on a distinguished road

      0  

    Default How to get values from active panel with several form fieldsets

    How to get values from active panel with several form fieldsets


    [RESOLVED]

    Hello all, just need right guidance. I'm using MVC and have an active panel with a docked toolbar and form panel with 2 fieldsets (1 fieldset with radiofield, and 1 fieldset with selectfield). See SortView code below.

    I have a dispatch handler to controller's action. I would like to check for radiofield and selectfield, then sort/filter thru store data, reload data, and finally setActiveItem with a panel with reloaded data.

    I just cant seem to figure out the best way to get values from form panel in controller so that I can appropriately call sort() and filter() methods to store.

    Really appreciate your help...

    Code:
    MyApp.views.SortView = Ext.extend(Ext.Panel,{
    ....
        dockedItems:[{
            xtype: 'toolbar',
            dock: 'top',
            title: 'Filter / Sort',
            layout: {
                pack: 'center'
            },
            items: [{
                text:'Cancel',
                handler: function(){
                    Ext.dispatch({
                        controller: 'Locations',
                        action: 'onCancelTap',
                        animation: {
                            type:'fade'
                        }
                    })
                }
            },{
                xtype:'spacer'
            },{
                text:'Search',
                handler: function(){
                    Ext.dispatch({
                        controller: 'Locations',
                        action: 'onSearchTap',
                        animation: {
                            type:'fade'
                        }
                    })
                }
            }]
        }],
    
           items:[{
            xtype: 'form',
            items: [{
                xtype: 'fieldset',
                title: 'Sort Results By',
                defaults: {
                    xtype: 'radiofield',
                    labelWidth: '50%'
                },
                items:[{
                    name: 'sortby',
                    label: 'Distance',
                    value: 'distance',
                    checked: true
                },{
                    name: 'sortby',
                    label: 'Store Code',
                    value: 'storecode'
                },{
                    name: 'sortby',
                    label: 'Store Group',
                    value: 'storegroup'
                }]
            },{
                xtype: 'fieldset',
                title: 'Narrow Results By',
                defaults: {
                    xtype: 'selectfield',
                    labelWidth: '30%'
                },
                items: [{
                    name: 'status',
                    label: 'Status',
                    options: [{
                        text: 'Active & Opening',
                        value: 'active'
                    },{
                        text: 'Any Status',
                        value: 'all'
                    }]
                },{
                    name: 'region',
                    label: 'Region',
                    options: [{
                        text: 'All Regions',
                        value: 'all'
                    },{
                        text:'SW1',
                        value:'sw1'
                    },{
                        text:'SW2',
                        value:'sw2'
                    }]
                }]
            }]
    
    
    });
    Ext.reg('sortview', MyApp.views.SortView);
    Code:
    Ext.regController('Locations',{
    ....
       onSearchTap: function(options){
            //check for values from active panel's form fieldsets then filter and/or sort
            //not sure how to go about here...
            this.application.store.mydata.filter(Mixed filters, String value);
            this.application.stores.mydata.sort('checkedvalue', 'ASC');
    
            this.application.stores.mydata.load();
            this.application.viewport.setActiveItem(this.listPanel);
      },
    ....
    });
    Last edited by won.rhee; 17 Nov 2011 at 1:39 PM. Reason: resolved

  2. #2
    Sencha User
    Join Date
    Jun 2011
    Posts
    52
    Vote Rating
    0
    won.rhee is on a distinguished road

      0  

    Default


    This is what I did:

    Changed MyApp.views.SortView to extend Ext.form.FormPanel, and made adjustment in items container.

    Then in controller, I can use getValues() method to get all values from this form panel.

    Code:
    Ext.regController('Locations',{
        ....   
        onSearchTap: function(options){
            //MyApp.views.SortView was rendered to this.formPanel 
            //before onSearchTap method was called
    
            var form_values = this.formPanel.getValues();
            if(form_values['sortby'] == 'storecode'){
                this.application.stores.mydata.sort('StoreCode', 'ASC'); 
                //'StoreCode' is a field already mapped in registered model.
            }          
    
    
            ... do more sorting ...
            
            this.application.viewport.setActiveItem(this.listPanel);
        }
    });
    No need to load() the store.