Question

我有一个textfield和一个按钮，如果Send留空或空，当用户点击textfield按钮时，我想弹出一条错误消息。我的代码如下;

根据我的代码，即使Send值为空，我也可以点击textfield按钮并提交。但是，当我单击文本字段并将其留空时，文本字段的边框变为红色，当hover超过textfield时，将弹出错误消息。

我想要做的是，当用户点击“发送”按钮时弹出错误消息（如果文本字段为空）。

                    {
                        xtype: 'button',
                        text: 'Send',
                        action: 'send1'

                    },

                    xtype: 'textfield',                            
                        name: 'name',
                        fieldLabel: 'Name',
                        allowBlank: false,
                        blankText: 'Name left blank'
                    },

Answer 1

                 {
                    xtype: 'button',
                    text: 'Send',
                    action: 'send1'

                },
                {
                    xtype: 'textfield',
                    id:'nameField',
                    name: 'name',
                    fieldLabel: 'Name',
                    allowBlank: false,
                    blankText: 'Name left blank'
                }

通过给出textfield的id，你可以在按钮的处理程序中包含以下代码

                if(Ext.getCmp('nameField').getValue().length== 0)
                   Ext.Msg.alert('FormSubmissionError','TextField should not be empty');
                else
                   Submit the form.

Answer 2

如果您需要提供弹出消息，则需要在按钮单击处理程序中手动执行此操作。 ExtJs不提供内置功能。但是你可以添加

formBind: true

进入按钮定义，ExtJs将禁用按钮，直到所有元素上的所有验证器都通过。

textfield为空时未显示错误消息

2 个答案: