如何在ExtJS中设置单个字段脏

时间:2015-06-24 15:59:15

标签: extjs save field

问题:我们在表单上切换字段。当显示secondField而不是firstField时,则更改表单。但是secondField仍然标记为不脏,因为两个字段保持不变。显示secondField应始终使它和表单(模型)变脏。

研究:setDirty()方法在整个记录上完成,setValue()按预期运行,但闻起来像黑客,不能用于各种字段类型(textfield,combobox)。

问题:如何手动设置单个表单字段状态更改为调用保存其数据?

1 个答案:

答案 0 :(得分:1)

您正在将数据状态与表单可视化混合在一起。默认情况下,显示"字段"与数据无关,因此您需要显式创建一个。这可以通过在切换时更改一些数据,或以其他方式更改数据来切换。

例如,在选中/取消选中一个复选框字段时会发生切换,该字段代表一段表单数据(另请参阅fiddle):

Ext.create('Ext.form.Panel', {
    viewModel: {
        type: 'default'
    },
    items: [
        {
            xtype: 'checkbox',
            reference: 'toggle',
            itemId: 'toggle',
            boxLabel: 'Toggle',
            hidden: true
        },
        {
            xtype: 'button',
            text: 'Toggle',
            enableToggle: true,
            toggleHandler: function() {
                var form = this.up('form'),
                    checkbox = form.child('#toggle');
                checkbox.setValue(!checkbox.getValue());
                console.log(form.isDirty() ? 'Dirty!' : 'Not dirty');
            }
        },
        {
            xtype: 'textfield',
            name: 'firstField',
            fieldLabel: 'First Field',
            bind: {
                hidden: '{toggle.checked}'
            }
        },
        {
            xtype: 'textfield',
            name: 'secondField',
            fieldLabel: 'Second Field',
            bind: {
                hidden: '{!toggle.checked}'
            }
        }
    ],
    renderTo: Ext.getBody()
});