1

我了解“选择字段”旨在从您提供的现有“选项”中进行选择(或从“商店”中的条目中进行选择)。

我想要的是用户不选择任何选项的可能性。最重要的是,如果能够在未选择任何选项时显示占位符(例如“选择一个...”),那就太好了。

当前的选择字段行为是,如果您未提供初始值或不属于“选项”(或您的“商店”)的值,则默认选择第一项。

关于选择器,我不介意在选择一个选项后是否无法返回空选择。我想要的是,如果您不触摸它,可以将选择字段留为空选择。

有没有人这样做的有效解决方案(覆盖选择字段?扩展一个新字段?)

4

2 回答 2

3

这是 Thiem Nguyen 扩展 Select 字段的解决方案的通用实现。希望它会节省一些时间;)

/**
 * Adds an additional option to a select field filled by a store
 * @cfg {mixed} valueFieldValue Value of the added option
 * @cfg {string} displayFieldValue Text to display for the added option
 */
Ext.define('util.field.SelectPlus', {
    extend: 'Ext.field.Select',
    xtype: 'selectfieldplus',
    alternateClassName: 'Ext.field.SelectPlus',
    requires: 'Ext.data.Store',

    config: {
        displayFieldValue: '',
        valueFieldValue: ''
    },

    /**@override
     * Insert our item each time the store is loaded
     * @param {Ext.data.Store} store The refreshed store
     */
    onStoreDataChanged: function(store) {
        if(store.findExact(this.getValueField(), this.getValueFieldValue()) === -1) { //prevent infinite loop ;)
            var item = Ext.create(store.getModel());
            item.set(this.getValueField(), this.getValueFieldValue());
            item.set(this.getDisplayField(), this.getDisplayFieldValue());
            store.insert(0, item);
        }
        this.callParent([store]);
    }
});
于 2013-11-14T13:51:59.767 回答
1

覆盖Ext.field.Select和扩展新领域都能够满足您的需求,但我真的更喜欢第二种解决方案。根据我的经验,无论用户从您的选择字段中选择“空”还是“非空”选项,都会执行后续流程。例如:

  • 将其作为“空”值保存到数据库中。
  • 简单地忽略它。

此外,由于它实际上是一个选项,用户可以随时在选择“非空”选项后再次选择“空”选项。

当然,这会有点烦人,尤其是当您与很多商店合作时。但是考虑到灵活性和易用性,我推荐这个解决方案。

于 2012-04-12T15:28:33.497 回答