Javascript 如何为store filter提供两个标识组合，一个在网格头上，一个作为网格列小部件

我有一个小部件列标题，通过它我可以选择值并过滤网格存储。我希望完全相同的网格标题以及。在这里，我给出了一个具有相同值的组合

这是我的列标题代码

header: {
    items: [{
            xtype: 'combo',
            displayField: "displayName",
            fieldLabel: 'Some Label',
            valueField: 'title',
            displayField: 'title',
            hidden : true,
            queryMode: 'local',
            value : 1,
            autoSelect : true,
            //dataindex:"MUTST",
            store: {
            fields: ["id", "displayName"],
            data: [
                    { "id": "1", "title": "Test1" },
                    { "id": "2", "title": "Test2" },
                    { "id": "3", "title": "Test3" }
                ]
            },
            listeners : {
                select : function(combo , record , eOpts){
                    debugger;
                    var sg = this.up("MyGrid");
                    var col = sg.getColumns()[0]; // Getting Header column
                    var flit =sg.getColumns()[0].filter // Here I am getting object instead of constructor
                    //this.focus = sg.onComboFilterFocus(combo);
                }
            },
        }]
},

我正在列中创建小部件类型

MyColumn: function(headersXmlDoc) {
    var me = this,
        gridConfig = {};

    gridConfig.columns = [];
    Ext.each(headersXmlDoc.getElementsByTagName("HEADER"), function(header) {
        var column = {
            text: header.getAttribute("L"),
            dataIndex: header.getAttribute("DATAINDEX"),
            sortable: (header.getAttribute("ISSORTABLE").toLowerCase()=="true"), 
            widgetType: header.getAttribute("WIDGET"),
            filterType: Ext.isEmpty(header.getAttribute("FILTER"))? undefined: header.getAttribute("FILTER"),
        };
        switch (header.getAttribute("WIDGET")) {
            case 'textbox':
                if(column.filterType){
                    if(column.filterType == 'TagData'){
                        column.filter = {
                            xtype: 'tagfield',
                            growMax  : 10,
                            valueField: 'title',
                            displayField: 'title',
                            parentGrid : me,
                            dataIndex:header.getAttribute("DATAINDEX"),
                            queryMode: 'local',
                            multiSelect: true,
                            isFilterDataLoaded: false,
                            disabled: true,
                            listeners:{
                                focus: me.SomeMethod, //
                            }
                        };                         
                    } 
                }
                break;

        }
        this.columns.push(column);
    }, gridConfig);

    return gridConfig.columns;
},

---

我想，如果我在标题组合中选择，它也会直接在小部件组合中选择。谁能解释一下怎么得到这个。提前感谢

因此，您基本上需要在标题中设置一个组合框，用于更改记录值-在网格单元格中显示组合的窗口小部件列在这里并不重要

我认为您已经非常接近了-但是您试图定义一个“header”配置并将组合添加到其项中-而不是直接在列中定义项：

columns: [{
    text: 'Combo Test',
    dataIndex: 'title',
    items: [{
        xtype: 'combobox',
        width: '100%',
        editable: false,
        valueField: 'title',
        displayField: 'title',
        queryMode: 'local',
        autoSelect: true,
        store: {
            data: [{
                "id": "1",
                "title": "Test1"
            }, {
                "id": "2",
                "title": "Test2"
            }, {
                "id": "3",
                "title": "Test3"
            }]
        },
        listeners: {
            select: function (combo, selectedRecord) {
                //we could just get the value from the combo
                var value = combo.getValue();
                //or we could use the selectedRecord
                //var value = selectedRecord.get('id');

                //find the grid and get its store
                var store = combo.up('grid').getStore();

                //we are going to change many records, we dont want to fire off events for each one
                store.beginUpdate();
                store.each(function (rec) {
                    rec.set('title', value);
                });
                //finish "mass update" - this will now trigger any listeners for saving etc.
                store.endUpdate();

                //reset the combobox
                combo.setValue('');
            }

        }
    }],
},

实际的值设置是在您尝试时在select listener中进行的-关键是在每个记录上循环记录和调用集：

//find the grid and get its store
var store = combo.up('grid').getStore();

//we are going to change many records, we dont want to fire off events for each one
store.beginUpdate();
store.each(function (rec) {
    rec.set('title', value);
});
//finish "mass update" - this will now trigger any listeners for saving etc.
store.endUpdate();

我制作了一把小提琴来展示这一点：