ExtJs，自定义TextField's的getValue()函数在提交表单时不被调用

ExtJs, custom TextField's getValue() function not being called when form is submitted

本文关键字：提交 函数 表单 调用 getValue TextField 自定义 ExtJs      更新时间：2023-09-26

我有一个扩展Ext.form.TextField (ExtJs 3.1.1)的自定义文本字段。我已经覆盖getValue提交一个计算值，而不是在超类的原始值。直接调用getValue，返回值正确。但是，当提交父表单时，根本不调用getValue (getValue方法中的调试消息不会出现在控制台中)。如何重写提交表单时返回的值?难道getValue不是重写的正确方法吗?

下面是类的一般布局(我不能提供实际的代码):

MyField = Ext.extend(Ext.form.Textfield, {
    constructor: function(config) {
        [initialize some basic variables....]
        MyField.superclass.constructor.call(this, config);
    },
    initComponent : function() {
         this.on('keypress', this.handler, this);
    },
    handler : function(field, event, args) {
         [set an internal value this.myValue based on superclass value]
    },
    getValue : function () {return this.myValue;}
});

在计算myValue并在调用getValue时返回它方面，上面的工作很好。然而，当添加在表单中，在Ext.form.TextField的值被返回，我也注意到，MyField.getValue是不被调用在父FormPanel对象上调用FormPanel.getForm().submit()。

如果不重写更多的行为，我认为你无法实现你想要做的事情。

如果调试到提交操作，您将在Ext.form.Action.Submit中看到以下内容:

Ext.Ajax.request(Ext.apply(this.createCallback(o), {
    form:this.form.el.dom,
    url:this.getUrl(isGet),
    method: method,
    headers: o.headers,
    params:!isGet ? this.getParams() : null,
    isUpload: this.form.fileUpload
}));

注意，它传递了实际的表单DOM元素(即this.form.el.dom)，它将包含您的字段的实际值，而不是您的计算值。

如果继续调试，您将看到在对Ext.Ajax.request的调用中，form参数通过Ext.lib.Ajax.serializeForm(form)被序列化。结果序列化值作为data参数传递给Ext.lib.Ajax.request。该值是实际发送到服务器的值。

相关文章：