Ext JS - 验证文本字段

Question

我是 Ext JS 的新手，所以我需要一些电子帮助来验证文本字段。

要求是用户单击“添加”按钮并显示一个新的 window。这个新的 windown 将有两个文本字段 ID 和名称。用户可以在名称字段中提供任何输入。但 ID 不应是 PLStore 中存在的 ID。

我知道我需要使用验证器，但如何迭代 PlStore 值？

{xtype: 'form',
            bodyPadding: 10,
            title: '',
            items: [
                {
                    xtype: 'textfield',
                    store: 'PLStore',
                    anchor: '100%',
                    fieldLabel: 'ID'
                },
                {
                    xtype: 'textfield',
                    anchor: '100%',
                    fieldLabel: 'Name'
                },

PLStore 包含以下 XML：

<?xml version="1.0" encoding="utf-8"?>
<Rowsets CachedTime="" DateCreated="2015-06-29T06:30:24" EndDate="2015-06-29T06:30:24" StartDate="2015-06-29T05:30:24" Version="15.0 SP4 Patch 4 (Jun 3, 2015)">
    <Rowset>

        <Row>
            <PLName>CA</PLName>
            <PLID>1001</PLID>
        </Row>
<Row>
            <PLName>VA</PLName>
            <PLID>1002</PLID>
        </Row>
<Row>
            <PLName>MH</PLName>
            <PLID>1003</PLID>
        </Row>

    </Rowset>
</Rowsets>

因此，如果用户将 ID 设置为 1001、1002 或 1003 - 将弹出一个错误。

怎么办？

提前致谢！

Answer 1

如果您使用的是 Ext > 4.0ish，那么您使用验证器的方法是正确的属性。您应该能够将其设置为自定义函数，并在其中进行验证。为了对照商店进行检查，一种选择是为该商店分配一个 storeId，以便您可以获得对其的引用以进行验证。因此，您的 "id" 字段配置可能类似于：

{
    xtype: 'textfield',
    anchor: '100%',
    fieldLabel: 'ID',
    validator: function(fieldVal) {
        var ds = Ext.getStore('myStoreId'),
            ix = ds.find('id', fieldVal);
        return ix < 0;
    }
}

其中 'myStoreId' 是您分配给数据存储的 "storeId"，"id" 假定是我们要查找的字段的 ID。

自从我使用该框架以来已经有一段时间了，所以这里的文档以防我遗漏了语法中的某些内容：

http://docs.sencha.com/extjs/4.2.3/#!/api

希望对您有所帮助！

Ext JS - 验证文本字段

Ext JS - Validating a TextField

javascript

extjs

extjs5

sencha-architect