Question

我正在用sencha touch创建我的第一个应用程序。我有表单验证的问题。这是形式：

var form = new Ext.form.FormPanel({
        title: 'Activity',
        items: [{
            xtype: 'fieldset',
            items: [{
                xtype: 'textfield',
                name : 'sector',
                label: 'Sector',
                required: true
            },
            {
                xtype: 'selectfield',
                name : 'city',
                label: 'City',
                options: [
                {
                    text: '*',
                    value: '*'
                },
                {
                    text: 'First Option',  
                    value: 'first'
                },
                {
                    text: 'Second Option', 
                    value: 'second'
                },
                {
                    text: 'Third Option',  
                    value: 'third'
                }]
            },
            {
                xtype: 'textfield',
                name : 'nation',
                label: 'Nation',
                required: true
            },
            {
                xtype: 'toolbar',
                docked: 'bottom',
                layout: {
                    pack: 'center'
                },
                items: [{
                    xtype: 'button',
                    text: 'Cerca',
                    handler: function() {
                        formSettori.submit({
                            url: 'book.php',
                            method: 'GET',
                            success: function() {
                                Ext.Msg.alert('OK');
                            },
                            failure: function() {
                                Ext.Msg.alert('NO');
                            }
                        });
                    }
                },
                {
                    xtype: 'button',
                    text: 'Reset',
                    handler: function() {
                        form.reset();
                    }
                }]
            }]
        }]
    });

表单只有三个字段： - 活动 -city -nation

所有字段都是必填项。活动和国家不能是空的，而城市不应该等于*

如何控制字段？谢谢！

Answer 1

没有内置方式来进行表单验证。你必须自己做。

最简单的方法是使用私有的Ext.form.Panel方法getFields遍历每个字段并确保它们不为空。

var fields = form.getFields(),
    field, name, isEmpty;

for (name in fields) {
    field = fields[name];
    isEmpty = (!field.getValue() || field.getValue() == "");

    if (isEmpty) {
        field.addCls('x-invalid');
    } else {
        field.removeCls('x-invalid');
    }
}

如果该字段为空，则我们添加x-invalid类（因此您可以设置样式）。

Sencha touche表单验证

1 个答案: