ExtJS 4 ComboBox Автозаполнение - PullRequest
Новая
       19

ExtJS 4 ComboBox Автозаполнение

5 голосов
/ 08 сентября 2011

У меня есть выпадающий список extjs, используемый для автозаполнения, имеющий следующую конфигурацию: 

xtype:'combo',
displayField: 'name',
valueField:'id',
store: storeVar,
queryMode: 'remote',
minChars:2,
hideTrigger:true,
forceSelection:true,
typeAhead:true

У меня есть две проблемы:

а. Если пользователь выбирает значение из списка, возвращенного с сервера, но позже хочет удалить это значение и оставить поле со списком пустым, тогда старые значения снова появляются при размытии, не позволяя списку оставаться пустым. Как я могу разрешить пустое значение в этом поле со списком в таком случае? Я понимаю, что это может быть связано с forceSelection: true, но тогда мне нужно оставить его истинным, так как в противном случае пользователь может ввести любое случайное значение.

б. Когда сервер возвращает пустой список, я хочу отобразить сообщение - значения не найдены . Я попытался сделать это, поместив это значение в сущность displayField, т.е. {id: '', name: 'No Value Found'}. Но тогда в этом случае пользователь может выбрать это значение и отправить его на сервер, что не соответствует ожидаемому. Таким образом, как я могу отобразить сообщение для пустого списка?

Может кто-нибудь, пожалуйста, пролить свет на это?

Ответы [ 2 ]

3 голосов
/ 12 октября 2011

Для проблемы, связанной с forceSelection в приведенном выше вопросе, ниже приводится описание хака, который может служить ожидаемой цели: 

Ext.override(Ext.form.field.ComboBox,{          
    assertValue: function() {
        var me = this,
            value = me.getRawValue(),
            rec;
        if (me.multiSelect) {
            // For multiselect, check that the current displayed value matches the current
            // selection, if it does not then revert to the most recent selection.
            if (value !== me.getDisplayValue()) {
                me.setValue(me.lastSelection);
            }
        } else {
            // For single-select, match the displayed value to a record and select it,
            // if it does not match a record then revert to the most recent selection.
            rec = me.findRecordByDisplay(value);
            if (rec) {
                me.select(rec);
            } else {
                if(!value){
                    me.setValue('');
                }else{
                    me.setValue(me.lastSelection);
                }
            }
        }
        me.collapse();
    }
});

Это необходимо включить после включения файлов библиотеки extjs.

Что касается другой проблемы с сообщением, которая будет отображаться при отсутствии значений - emptyText - работает нормально, как это было предложено Варуном.

Надеюсь, это поможет кому-то искать что-то похожее.

2 голосов
/ 08 сентября 2011

Я сделал это для Ext JS 3.3.1. Я не знаю, относятся ли они к Ext JS 4, хотя, думаю, им следует.

Для первой проблемы установите autoSelect : false. autoSelect по умолчанию установлено на true. Это будет работать, только если установлен allowBlank : true. Из документов

true, чтобы выбрать первый результат, полученный хранилищем данных (по умолчанию к истине). Ложное значение потребует ручного выбора из раскрывающийся список для установки значения компонентов, если только значение (typeAheadDelay) были истинными.

Для второй проблемы используйте listEmptyText. Из документов

Пустой текст для отображения в представлении данных, если элементы не найдены. (по умолчанию '')

Приветствие.

...