0

这是一个两部分的问题:

主要问题:假设我有一个从商店拉出的组合框(下面的代码)。假设我有一个要过滤数据的数组,以便只有某些值实际显示在下拉列表中。我似乎找不到可以做到这一点的参数......有没有一种简单的方法可以做到这一点?

第二个问题:我还需要能够在创建下拉列表后根据用户的操作禁用和重新启用下拉列表中的项目。是否有一个功能可以在下拉菜单中重新启用/禁用项目?

注意:禁用我的意思是“不存在”,也就是在 dom 中删除,但仍然存在于未过滤的商店中。

{
  xtype: 'combobox',
  anchor: '100%',
  name: 'Permission_id',
  fieldLabel: 'Permissions',
  hideLabel: false,
  displayField: 'Name',
  forceSelection: true,
  store: 'PermissionStore',
  typeAhead: true,
  valueField: 'id',
  valueNotFoundText: 'Add Permission'
}
4

2 回答 2

0

我认为您所需要的只是使用过滤器。如果您只想在下拉列表中显示某些值,您唯一需要做的就是过滤存储,如果您拥有的是一个数组,您可以使用 ArrayStore。

关于您的第二个问题,如果您过滤商店,原始值不会丢失,它们会在内部保存为快照,然后当您清除过滤器时,旧值会再次显示在 dropdonlist 中。

请看一下这个工作示例:http: //jsfiddle.net/lontivero/Mz6S4/1/

第一个答案:方法是。过滤器()。例如:

var store = Ext.create('Ext.data.ArrayStore', {
    fields: ['Id', 'Name'],    
    data: [
        [ 1, 'Lucas' ],
        [ 2, 'Pablo' ],
        [ 3, 'Francisco' ]
    ]
});


Ext.create('Ext.form.field.ComboBox', {
    fieldLabel: 'Permissions',
    displayField: 'Name',
    store: store,
    valueField: 'Id',
    renderTo: Ext.getBody()
});

//Hide Pablo in the dropdownlist
store.filter([
    {filterFn: function(record) { return record.get('Name') !== 'Pablo'; }}
]);

// uncomment this to reenable hidden records (to display Pablo again)
//store.clearFilter();

第二个答案:清除商店的过滤器

于 2012-11-29T03:24:02.613 回答
0

正如 lontivero 所说,过滤器可以解决您的问题:

primary:数组可以包含数据,但过滤器会将其从下拉列表中隐藏

次要:过滤器可以更改为隐藏和显示在下拉列表中

那么,您剩下的问题是如何从非 Ext 代码更改过滤器。在这里,您可以使用 Ext 只是 javascript 并且可以从与 Ext 无关的任何其他 javascript 调用的事实。

所以:

  1. 在 HTML DOM 可访问的位置/范围中添加一些应用过滤器以添加和删除的功能
  2. 将它们添加到onclick(纯 HTML)按钮的处理程序中

诀窍实际上是通过使用 Ext 的 id 查找来访问商店。

因此,如果以下代码(在 lontivero 的 jsfiddle 上扩展)直接在 js 文件中(或在脚本标签中),它会满足您的要求:

(jsfiddle:http: //jsfiddle.net/mCv6A/

// functions that do the filtering
var noPablo = function(record) { return record.get('Name') !== 'Pablo' }
var noJames = function(record) { return record.get('Name') !== 'James' }

// the combination of functions we'll use
var withoutJamesFilter = [{ filterFn: noPablo }, { filterFn: noJames }]
var withJamesFilter = [{ filterFn: noPablo }]

function addJames()
{
    var store = Ext.getStore('people')
    store.clearFilter()
    store.filter(withJamesFilter)
}

function delJames()
{
    var store = Ext.getStore('people')
    store.clearFilter()
    store.filter(withoutJamesFilter)
}

Ext.onReady(function()
{
    var store = Ext.create('Ext.data.ArrayStore', {
        id: 'people',
        fields: ['Id', 'Name'],    
        data: [
            [ 1, 'Lucas' ],
            [ 2, 'Pablo' ],
            [ 3, 'Francisco' ],
            [ 4 , 'James' ]
        ]
    })

    Ext.create('Ext.form.field.ComboBox', {
        fieldLabel: 'Permissions',
        displayField: 'Name',
        store: store,
        valueField: 'Id',
        renderTo: Ext.getBody()
    })

    // start without james in list
    store.filter(withoutJamesFilter)
})

实际使用时需要考虑的事项(而不是在简化示例中):

  • wrapping addJamesdelJames以及它们在对象或立即函数中使用的变量(noPablonoJames),因此变量不会弄乱全局(窗口)范围
  • 重写过滤器变量以更好地共享实现(类似于获取名称列表并生成过滤器数组或过滤器函数来过滤掉这些名称的函数是明智的)
于 2013-03-19T23:26:16.503 回答