Hybrid View

  1. #1
    Sencha User
    Join Date
    May 2012
    Posts
    1
    Vote Rating
    0
    bishamon is on a distinguished road

      0  

    Default Two Ext.grid.CheckColumn lists and one store

    Two Ext.grid.CheckColumn lists and one store


    Hi,

    I have two check columns to build to use the same store, how can I differentiate them? I'm build a method to create the grid with the CheckColumns and execute it two times to generate two grids that I render at two different places on screen. It shows well on the screen, but when select any checkbox from one grid, it select the correspondent from the other one. How can I differentiate them?

    Code:
    function createLists(){
        var checkColumn = new Ext.grid.CheckColumn({
            dataIndex : 'selected',
            id : 'list',
            width : 28,
            sortable : false,
            filter : {
                field : {
                    id : 'comboid',
                    xtype : "combo",
                    mode : 'local',
                    store : new Ext.data.JsonStore({
                        fields : [ 'label', 'id' ],
                        idProperty : 'id'
                    }),
                    editable : false,
                    valueField : 'id',
                    displayField : 'label',
                    triggerAction : 'all',
                    value : "all",
                    listWidth : 190
                },
                filterCls : 'row-selection',
                showFilterIcon : false,
                showRemoveButtonOff : false,
                showRemoveButton : false,
                forceSelection: true,
                fieldEvents : [ "select" ]
            }
        });
    
    
        var gridColumnModel = new Ext.grid.ColumnModel({
            defaults : {
                menuDisabled : true
            },
            selectedClass:'x-list-selected',
            columns : [
                    checkColumn,
                    {
                        id : 'id',
                        dataIndex : 'label',
                        width : 193
                    }
            ]
        });
    
    
        var grid = new Ext.grid.GridPanel({
            plugins : [ checkColumn ],
            store: MyJsonStore,
            colModel: gridColumnModel,
            width: 480,
            height: 100,
            frame: false
        });
        
        return grid;
    }

  2. #2
    Sencha User
    Join Date
    Mar 2011
    Posts
    5
    Vote Rating
    0
    elthrasher is on a distinguished road

      0  

    Default


    What you want to do is use Ext.extend() to create a custom xtype for your class, then instantiate it. You should be able to find examples of how to do this, but basically you create your extension:

    Code:
    Ext.ns('mynamespace');
    
    mynamespace.myGrid = Ext.extend(Ext.grid.GridPanel, {
       // some basic config stuff here
      initComponent: function() {
        mynamespace.myGrid.superclass.initComponent.call(this);
      }
    });
    
    Ext.reg('mynamespace.myGrid', mynamespace.myGrid);
    Usually the above lives in its own .js file.

    Then later you can just add mynamespace.myGrid to a list of components or call new mynamespace.myGrid().

    If all that doesn't make sense, you should really read up on Ext.ns() and Ext.extend() before trying it.

    So that's the proper ExtJs way of instantiating a class more than once. You might be interested to know why your way is failing. It is likely because you are accessing your component by its id. You give two components the same id and that causes no end of trouble. There are lots of good models for avoiding ever even setting the id, so there's something else to look into.

    If you want to keep using ids, just make sure each of your objects has a unique one so don't set it on your extension class. Set it when you instantiate the class.

    Code:
    items: [{
      xtype: 'mynamespace.myGrid',
      id: 'topGrid'
    }]
    or

    Code:
    var topGrid = new mynamespace.myGrid({
      id: 'topGrid'
    });
    Depending on how you are instantiating it.

Thread Participants: 1

Tags for this Thread

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