1. #1
    Ext User
    Join Date
    Mar 2008
    Posts
    11
    Vote Rating
    0
    jwong is on a distinguished road

      0  

    Default Editable Grid with All ComboBoxes, and Distinct values?

    Editable Grid with All ComboBoxes, and Distinct values?


    Hey Guys,

    I have searched through the forums and tried solutions piece by piece on my grid but it still doesn't work properly. Any help is highly appreciated.

    The grid and all the combos share the same store.

    When you make any changes in any combo box and tab out, it doesn't keep it.

    When you type in the combo box, having the focus on the combo box for more than a couple of seconds, it flashes back to the first value on the list.

    Grid Code:
    Code:
    Ext.onReady(function(){
        Ext.QuickTips.init();
    
        // shorthand alias
        var fm = Ext.form;
        
        store = new Ext.data.JsonStore({    
            url: 'admin/searchrules.action',
            fields: ['from', 'to', 'ruleContextCode', 'results1'],
            root: 'records', 
            totalProperty: 'record_count', 
            autoLoad:true
        });
        var comboFrom = new Ext.form.ComboBox({
            displayField:'from',
            store: store,
            typeAhead: true,
            mode: 'local',
            triggerAction: 'all',
            emptyText:'Select a sender',
            selectOnFocus:true,
            listeners: {
              beforequery: function(qe) {
                qe.forceAll = true;
              }
            }
        });    
        var comboTo = new Ext.form.ComboBox({
            displayField:'to',
            store: store,
            typeAhead: true,
            mode: 'local',
            triggerAction: 'all',
            emptyText:'Select a recipient',
            selectOnFocus:true,
            listeners: {
              beforequery: function(qe) {
                qe.forceAll = true;
              }
            }
        });    
        var comboContext = new Ext.form.ComboBox({
            displayField:'ruleContextCode',
            store: store,
            typeAhead: true,
            mode: 'local',
            triggerAction: 'all',
            emptyText:'Select a result',
            selectOnFocus:true,
            listeners: {
              beforequery: function(qe) {
                qe.forceAll = true;
              }
            }
        });    
        var comboResults = new Ext.form.ComboBox({
            displayField:'results1',
            store: store,
            typeAhead: true,
            mode: 'local',
            triggerAction: 'all',
            emptyText:'Select rule context',
            selectOnFocus:true,
            listeners: {
              beforequery: function(qe) {
                qe.forceAll = true;
              }
            }
        });
        
        var cm = new Ext.grid.ColumnModel([{
               id:'from',
               header: "From",
               dataIndex: 'from',
               editor: comboFrom
            },{
               header: "To",
               dataIndex: 'to',
               editor: comboTo
            },{
               header: "Context",
               dataIndex: 'ruleContextCode',
               editor: comboContext
            },{
               header: "Results",
               dataIndex: 'results1',
               editor: comboResults
            }
        ]);
    
        // by default columns are sortable
        cm.defaultSortable = true;
        
        var Rules = Ext.data.Record.create([            
                {name: 'key'},
                {name: 'from'},
                {name: 'to'},
                {name: 'results1'},
                {name: 'results2'},
                {name: 'ruleContextName'},
                {name: 'ruleContextCode'},
            ])
        
        // create the editor grid
        var grid = new Ext.grid.EditorGridPanel({
            store: store,
            cm: cm,
            renderTo: 'rules-grid',
            width:800,
            height:400,
            title:'Rules',
            frame:true,
            clicksToEdit: 1,
            viewConfig: {
                forceFit: true
            },
    
            // inline buttons
            buttons: [{text:'Save'},{text:'Cancel'}],
            buttonAlign:'center',
    
            // inline toolbars
            tbar:[{
                text:'Add Rules',
                iconCls:'add',
                handler : function(){
                    var r = new Rules({
                        from: 'ANY',
                        to: 'ASO',
                        ruleContextCode:'Use Default Templates',
                        results1: 'Yes'
                    });
                    grid.stopEditing();
                    store.insert(0, r);
                    grid.startEditing(0, 0);
                }
            }],
        });
    
        grid.render("rules-grid");
    
    };
    Store Code Example:
    Code:
    {record_count: "6","records":[{key:	"1",	from:   "ANY",	to:	"ANY",	results1:  "First",	results2:  "First",	ruleContextName:"TEMPLATE_ORDER_SELECTION",	ruleContextCode:"Template Order Selection"},
    Also is it possible to return only distinct values from the store to populate the combo box? In the screenshot, you will see "ANY" repeated as an option multiple times. I would like it to display as an option only once.
    Attached Images

  2. #2
    Ext GWT Premium Member gslender's Avatar
    Join Date
    Mar 2008
    Location
    Brisbane, Australia
    Posts
    1,572
    Vote Rating
    4
    gslender is on a distinguished road

      0  

    Default


    wrong forum - this is the GWT version

    you'll need to post in the Ext area http://extjs.com/forum/forumdisplay.php?f=9

  3. #3
    Ext User
    Join Date
    Mar 2008
    Posts
    11
    Vote Rating
    0
    jwong is on a distinguished road

      0  

    Default


    Ah, my bad. Post it again in the right forum or can I ask someone to move it?

  4. #4
    Ext GWT Premium Member gslender's Avatar
    Join Date
    Mar 2008
    Location
    Brisbane, Australia
    Posts
    1,572
    Vote Rating
    4
    gslender is on a distinguished road

      0  

    Default


    could be quicker to repost

  5. #5
    Ext User
    Join Date
    Mar 2008
    Posts
    11
    Vote Rating
    0
    jwong is on a distinguished road

      0  

    Default


    Ok, reposted. Thanks!

Thread Participants: 1