Question

我的问题是在FTPSettingHost的更改事件中，markInvalid没有标记该字段无效：我的意思是无效，该字段以红色曲折突出显示。每次更改字段（更改事件）时，我都会显示空字段，并将其标记为无效。

是否可以为此制作验证器？如何？什么时候调用验证器？

以下是小组：

Ext.define("Backend.project.FtpPanel", {
    xtype : "ftpPanel",
    extend : "Ext.form.Panel",
    border : 0,
    id : 'ftpForm',
    layout : 'anchor',
    defaults : {
        labelStyle : "font-weight: font-size: 11px",
        fieldStyle : "font-size: 12px;",
        anchor : "100%",
        labelWidth : 180
    },
    initComponent : function () {
        var me = this;
        var ftpFields = [{
                id : 'FTPSettingsHost',
                label : LocalizationUtils.getMessage("FTPHost")
            }, {
                id : 'FTPSettingsPath',
                label : LocalizationUtils.getMessage("FTPPath")
            }, {
                id : 'FTPSettingsUsername',
                label : LocalizationUtils.getMessage("FTPUsername")
            }, {
                id : 'FTPSettingsPassword',
                label : LocalizationUtils.getMessage("FTPPassword")
            }
        ];
        this.FTPSettingsHost = new Ext.form.field.Text({
                fieldLabel : LocalizationUtils.getMessage("FTPHost"),
                anchor : "100%",
                id : "FTPSettingsHost",
                name : "FTPSettingsHost",
                xtype : 'textfield',
                allowOnlyWhitespace : false,
                //validator : FormUtils.getAllFieldsNonEmptyValidator("FTPSettingsPath", ftpFields)
                listeners : {
                    change : {
                        fn : function (cmp) {
                            // Get empty fields
                            var fields = FormUtils.getEmptyFields(me);
                            var labels = [];
                            for (var i = 0; i < fields.length; i++) {
                                //console.log(fields[i]);
                                labels[i] = fields[i].getFieldLabel();
                            }
                            var message = LocalizationUtils.getMessage("AllTheseFieldsRequired", [labels.join(", ")]);
                            for (var i = 0; i < fields.length; i++) {
                                fields[i].clearInvalid();
                                fields[i].markInvalid(message);
                            }
                        }
                    }
                }
            });
        this.FTPSettingsPath = new Ext.form.field.Text({
                fieldLabel : LocalizationUtils.getMessage("FTPPath"),
                anchor : "100%",
                id : "FTPSettingsPath",
                name : "FTPSettingsPath",
                xtype : 'textfield',
                allowOnlyWhitespace : false,
            });
        this.FTPSettingsUsername = new Ext.form.field.Text({
                fieldLabel : LocalizationUtils.getMessage("FTPUsername"),
                anchor : "100%",
                id : "FTPSettingsUsername",
                name : "FTPSettingsUsername",
                xtype : 'textfield',
                allowOnlyWhitespace : false,
            });
        this.FTPSettingsPassword = new Ext.form.field.Text({
                fieldLabel : LocalizationUtils.getMessage("FTPPassword"),
                anchor : "100%",
                id : "FTPSettingsPassword",
                name : "FTPSettingsPassword",
                xtype : 'textfield',
                allowOnlyWhitespace : false,
            });
        Ext.apply(this, {
            items : [me.FTPSettingsHost, me.FTPSettingsPath, me.FTPSettingsUsername, me.FTPSettingsPassword]
        });
        this.callParent(this);
    }
})

谢谢大家的帮助！

Answer 1

我看了你的小提琴，这是我的版本：http://jsfiddle.net/Jandalf/UehL7/22/

Ext.define("Backend.project.FtpPanel", {
    xtype: "ftpPanel",
    extend: "Ext.form.Panel",
    border: 1,
    id: 'ftpForm',
    height: 200,
    width: 500,
    renderTo: Ext.getBody(),
    layout: 'anchor',
    bodyPadding: 10,
    fieldDefaults: {
        allowBlank: false,
        labelStyle: "font-weight: bold; font-size: 11px",
        fieldStyle: "font-size: 12px;",
        anchor: "100%",
        labelWidth: 180
    },
    items: [{
            fieldLabel: "FTPHost",
            id: "FTPSettingsHost",
            name: "FTPSettingsHost",
            xtype: 'textfield'
        },{
            fieldLabel: "FTPPath",
            id: "FTPSettingsPath",
            name: "FTPSettingsPath",
            xtype: 'textfield'
        },{
            fieldLabel: "FTPUsername",
            id: "FTPSettingsUsername",
            name: "FTPSettingsUsername",
            xtype: 'textfield'
        },{
            fieldLabel: "FTPPassword",
            id: "FTPSettingsPassword",
            name: "FTPSettingsPassword",
            xtype: 'textfield'
        }]
});

这是您想要的，还是您真的需要立即将所有字段标记为无效？

markInvalid不是用红色曲折标记字段

1 个答案: