Ext JS - Проверка TextField

Я новичок в Ext JS, поэтому мне нужна помощь в проверке текстового поля.

Требование заключается в том, что пользователь нажимает кнопку "Добавить", и появляется новое окно. Эта новая ветровка будет иметь два текстовых поля: ID и Имя. USer может дать любой вклад в поле Name. Но ID не должен быть идентификатором, который присутствует в PLStore.

Я знаю, что мне нужно использовать валидатор, но как вывести значение через значение 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>

Поэтому, если пользователь вводит идентификатор как 1001, 1002 или 1003 - должна появиться ошибка.

Как это сделать?

Заранее спасибо!

1 ответ

Решение

Если вы используете Ext > 4.0ish, вы на правильном пути со свойством validator. Вы должны быть в состоянии установить это для пользовательской функции и выполнить свою проверку в этом. Для того, чтобы проверить в магазине, одним из вариантов будет назначить этот магазин 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" - это идентификатор поля, которое мы ищем.

Прошло немного времени с тех пор, как я работал с фреймворком, поэтому здесь документы на случай, если я что-то упустил в синтаксисе:

http://docs.sencha.com/extjs/4.2.3/

Надеюсь это поможет!

Другие вопросы по тегам