events - 为什么 Ext.form.Field.setValue() 不触发事件? "fix"怎么办呢?

标签 events combobox extjs listener

为什么 Ext.form.Field 的 setValue 不会触发事件来通知监听器它的值已更改?我知道有 changeselect组合框的事件,但这些仅在用户交互时触发事件,当另一个组件更改字段的值时呢?让我解释一下我面临的情况。

我目前正在研究一个可重用的字段集组件(我们称之为 ux.fieldset),其中包含一个组合框和另一个字段集。应根据组合框的选定值隐藏/显示内部字段集。
我在组合框上注册了一个监听器,它监听 select事件,当它触发时只评估选定的值并显示/隐藏内部字段集。

然后我将此 ux.fieldset 作为组件添加到我的一个表单中。

现在,当我在表单上执行 loadRecord() 时,我希望重新评估内部组合框的值,以便我可以显示/隐藏组件的内部字段集。
执行此评估的代码显然应该在 ux.fieldset 中,因为它包含组合框并且因为它是可重用的,所以将它放在那里(DRY)是明智的。

是否有首选或更好的方法来处理这种情况?我已经在下面粘贴了我的 ux 代码,以防有人对我上面的解释感到困惑。

Ext.ux.form.StatusFieldSet = Ext.extend(Ext.form.FieldSet, {
     enablePublishFrom      : false // Wether or not the option to (un)publish on a certain date should be visible, defaults to false
    ,item_store             : false
    ,combo                  : false
    ,date_publish           : false
    ,date_unpublish         : false
    ,helpBox                : {
         xtype              : 'box'
        ,autoEl             : {cn: 'Help text<br />'}
    }
    ,publishData_fieldset   : false
    ,datePickerWidth        : 60 // The width of the datepickers in the subfieldset

    ,initComponent : function(){

        this.item_store = [['online',  _('Gepubliceerd')]]; // Online
        if(this.enablePublishFrom) {this.item_store.push(['pending', _('Publiceer op datum')]);} // Publish on date
        this.item_store.push(['offline', _('Niet gepubliceerd')]); // Offline

        this.combo = new Ext.form.ComboBox({
             name           : 'status'
            ,hideLabel      : true
            ,displayField   : 'txt'
            ,valueField     : 'quicklink'
            ,hiddenName     : 'status'
            ,value          : 'online'
            ,forceSelection : true
            ,allowBlank     : false
            ,editable       : false
            ,triggerAction  : 'all'
            ,mode           : 'local'
            ,store          : new Ext.data.SimpleStore({
                 fields     : [ 'quicklink', 'txt' ]
                ,data       : this.item_store
            })
            ,listeners      : {
                 scope      : this
                ,select     : function(combo, value, index) {   // HERE I would like to add another listener that gets triggered when another value is selected or set through setValue()
                    this.showOnPending(value.data.quicklink);
                }
            }
        });

        this.date_publish = new Ext.form.DateField({
             fieldLabel : _('Publiceer op')
            ,name       : 'publish_date'
            ,format     : 'd-m-Y'
            ,width      : this.datePickerWidth
        });

        this.date_unpublish = new Ext.form.DateField({
             fieldLabel : _('De-publiceer op')
            ,name       : 'unpublish_date'
            ,format     : 'd-m-Y'
            ,width      : this.datePickerWidth
        });

        this.publishData_fieldset = new Ext.form.FieldSet({
             autoHeight         : true
            ,hidden             : true
            ,anchor             : '0'
            ,defaults           : {
                 labelSeparator : ''
                ,anchor         : '0'
            }
            ,items              : [ this.helpBox, this.date_publish, this.date_unpublish ]
        });

        // Config with private config options, not overridable
        var config = {
             items      : [ this.combo, this.publishData_fieldset ]
            ,title      : _('Status')
            ,autoHeight : true
        };

        Ext.apply(this, Ext.apply(this.initialConfig, config));

        Ext.ux.form.StatusFieldSet.superclass.initComponent.call(this, arguments);

    }

    ,showOnPending: function(v) {
        if(v == 'pending'){
            this.publishData_fieldset.show();
        } else {
            this.publishData_fieldset.hide();
        }
    }
});

Ext.reg('statusfieldset', Ext.ux.form.StatusFieldSet);

更新:

我已经通过在组合框实例上重载 setValue 方法来解决这个问题。但如果你问我,这绝不是一个优雅或好的解决方案。
this.combo.setValue = function(v){
    this.showOnPending(v);
    return Ext.form.ComboBox.superclass.setValue.apply(this.combo, arguments);
}.createDelegate(this);

我想从 ExtJS 老手那里得到一些意见,他们将如何处理它。

最佳答案

是的,setValue不会触发任何事件。我只能推测原因。我可以告诉您,您正在使用 Combo 的任何功能。添加到 setValue虽然你的工作。

像这样的东西会更安全。

this.combo.setValue = this.combo.setValue.createSequence(this.showOnPending, this);

还有一些代码可以“修复”setValue所以它会触发一个事件。我会试着找到它。它将第二个参数添加到 setValue。您可以覆盖 Combo.prototype.setValue使用 Ext.override与它:http://code.extjs.com:8080/ext/ticket/185 .

最后,我认为创建序列仍然是您最安全的选择。

关于events - 为什么 Ext.form.Field.setValue() 不触发事件? "fix"怎么办呢?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4781461/

相关文章:

extjs - Sencha cmd 4 添加css和js

c# - 用于捕获撰写邮件事件的 outlook 插件

javascript - 在脚本标签 vue2 中监听来自 js 代码的自定义事件

c# - ASP.NET:通过 Intellisense 的 Page_Events 列表?我怎么知道签名?

.net - 1000个组合框绑定(bind)

.net - 组合框,Windows 7 和 8.1 上的不同行为

php - Uploadify 的动态响应函数

java - ListView编辑没有将单元格切换到输入状态

c# - 如何将 ComboBox 绑定(bind)到一列列表

javascript - Textfield在Ext JS中无效也显示有效