免费视频淫片aa毛片_日韩高清在线亚洲专区vr_日韩大片免费观看视频播放_亚洲欧美国产精品完整版

我是ExtJs的新手.我有一個與數(shù)據(jù)存儲綁定的GridPanel.我有一個checkboxgroup,它包含GridPanel行的可能值.我想用checkboxgroup值過濾GridPanel.

這是代碼 –

Store1 = new Ext.data.JsonStore({url: 'CustomerProfiles/GetDetails',root: 'rows',fields:['Name','Id']});DetailedResults =                {                    xtype: 'grid',                    autoHeight: true,                    autoWidth: true,                    autoScroll: true,                    border: false,                    trackMouseOver: false,                    frame: true,                    store: Store1,                    columns: [                        { header: 'Name', dataIndex: 'Name', width: 90 },                        { header: 'Id', dataIndex: 'Id', width: 50 }                    ]                };Leftpanel = new Ext.Panel({id: 'Leftpanel',frame: true,width: 175,items: [        {            xtype: 'label'        },        {            xtype: 'checkboxgroup',            columns: 1,            vertical: true,            items: [{                boxLabel: 'ALL',                name: 'chkName',                inputValue: 'all'            }, {                boxLabel: 'N1',                name: 'chkName',                inputValue: 'N1'            }, {                boxLabel: 'N2',                name: 'chkName',                inputValue: 'N2'            }, {                boxLabel: 'N3',                name: 'chkName',                inputValue: 'N3'            }], listeners: {                change: {                    fn: function () {                        Store1.clearFilter();                        var selectedValue = this.getValue();                        for (var i = 0; i < selectedValue.length; i  ) {                            Store1.filter('Name', selectedValue[i].inputValue);                        }                    }                }            }                     }            ]});

哪里出錯了？

PS：我使用的是3.4版本

解決方法:

getValue()方法有點棘手,它返回的對象具有可變結(jié)構(gòu),具體取決于結(jié)果集,這會導致代碼中出現(xiàn)問題.但是,getChecked()方法更簡單,我將在解決方案中使用它.
然后,我們使用filterBy,因為它在這種情況下更有用.
在這里你有解決方案(評論內(nèi)聯(lián))：

change: {    fn: function () {        var checkedBoxes = this.getChecked(), //Array of checked checkboxes            selectedValues = []; //Array of selected values                                               for (var i = 0; i < checkedBoxes.length; i  ) {            selectedValues.push(checkedBoxes[i].inputValue); //Add each inputValue to the array                                               }                                            var allSelected = Ext.Array.contains(selectedValues, 'all'); //Whether the 'ALL' option was selected        Store1.filterBy(function(record){           //If all was selected or if the name is included in the selectedValues, include the item in the filter           return allSelected || Ext.Array.contains(selectedValues, record.get('Name'));                                                 });    }}

問題解決了.經(jīng)過測試和工作:)

UPDATE
上面的代碼適用于ExtJs> = 4.對于Ext 3.4,這是代碼：

change: {    fn: function () {        var selectedValues = []; //Array of selected values         this.items.each(function(checkbox){            if(checkbox.checked)                selectedValues.push(checkbox.inputValue);        });                                            var allSelected = selectedValues.indexOf('all') >= 0; //Whether the 'ALL' option was selected                   Store1.filterBy(function(record){           //If all was selected or if the name is included in the selectedValues, include the item in the filter           return allSelected || selectedValues.indexOf(record.get('Name')) >= 0;                                                 });    }}

可選(額外改進,僅適用于ExtJs 4.x)
但是,檢查您的應(yīng)用程序,我認為可以進行以下改進：

>根據(jù)商店數(shù)據(jù)動態(tài)創(chuàng)建過濾器復(fù)選框
>將ALL復(fù)選框與其余復(fù)選框同步(即選擇ALL時,選中所有其他復(fù)選框)

這是具有改進的代碼：

var Store1 = new Ext.data.JsonStore({    proxy: {        type: 'ajax',                        url: 'CustomerProfiles/GetDetails',        reader: {                                root: 'rows'                            }    },                autoLoad: true,                            fields: ['Name','Id'],    listeners: {            //Each time the store is loaded, we create the checkboxes dynamically, and add the checking logic in each one        load: function(store, records){            createCheckboxesFromStore(store);                               }    }});var DetailedResults = {    xtype: 'grid',    autoHeight: true,    autoWidth: true,    autoScroll: true,    border: false,    trackMouseOver: false,    frame: true,    store: Store1,    columns: [        { header: 'Name', dataIndex: 'Name', width: 90 },        { header: 'Id', dataIndex: 'Id', width: 50 }    ]};var Leftpanel = new Ext.Panel({    id: 'Leftpanel',    frame: true,    width: 175,    items: [        {            xtype: 'label'        },        {            xtype: 'checkboxgroup',            columns: 1,            vertical: true,        }            ]});function createCheckboxesFromStore(store){    var checkBoxGroup = Leftpanel.down('checkboxgroup');    checkBoxGroup.removeAll();    checkBoxGroup.add({        itemId: 'allCheckbox',        boxLabel: 'ALL',        name: 'chkName',        inputValue: 'all',        checked: true,        listeners: {             change: function (chbx, newValue) {                                                         console.log("Changed ALL to ", newValue);                 if(newValue){  //If ALL is selected, select every checkbox                                                        var allCheckboxes = this.up('checkboxgroup').query("checkbox"); //Array of all checkboxes                     for (var i = 0; i < allCheckboxes.length; i  ) {                         allCheckboxes[i].setValue(true);                                                              }                 }             }           }    });    //Create one checkbox per store item    store.each(function(record){        checkBoxGroup.add({            boxLabel: record.get('Id'),            name: 'chkName',            inputValue: record.get('Name'),            checked: true,            listeners: {                change: function (chbx, newValue) {                    console.log("Changed ", chbx.inputValue, " to ", newValue);                    var checkboxGroup = this.up('checkboxgroup'),                        checkedBoxes = checkboxGroup.getChecked(), //Array of checked checkboxes                        selectedValues = []; //Array of selected values                                                           //If we uncheck one, also uncheck the ALL checkbox                    if(!newValue) checkboxGroup.down("#allCheckbox").setValue(false);                    for (var i = 0; i < checkedBoxes.length; i  ) {                        selectedValues.push(checkedBoxes[i].inputValue); //Add each inputValue to the array                                                           }                                                                                            Store1.filterBy(function(record){                       //If all was selected or if the name is included in the selectedValues, include the item in the filter                       return Ext.Array.contains(selectedValues, record.get('Name'));                                                             });                }                                            }        });    });}

這也是測試和工作:).如果你需要它,我可以通過jsfiddle鏈接運行代碼(告訴我).

干杯,來自玻利維亞拉巴斯