сенча сенсорный текстовое поле очистить событие - PullRequest
Новая
       16

сенча сенсорный текстовое поле очистить событие

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

Я пытаюсь реализовать фильтр списка в текстовом поле в сенсорном Сенча. Например, у меня было бы несколько контактов, и когда я набрал текст в поле, он мог бы фильтровать по имени. Когда я нажимаю круглую кнопку X, чтобы очистить текстовое поле, я хочу сбросить фильтр, чтобы отфильтровать ни один из контактов.

Проблема в том, что я не могу найти способ обнаружить щелчок по кнопке очистки. Кажется, что нет никакого типа события, и я не могу взломать обходной путь.

Если у кого-нибудь есть идеи, как обнаружить очистку текстового поля в сенсорном прикосновении, я был бы очень признателен.

Я пробовал в симуляторе Safari и XCode и использую Sencha Touch 1.1.0. Я что-то пропустил? Разве это не проблема, когда это мобильное приложение?

Ответы [ 3 ]

8 голосов
/ 09 сентября 2011

Вы можете прослушивать события касания clearIconContainerEl внутри текстового поля или переопределять метод onClearIconTap . 

Ext.setup({
    icon: 'icon.png',
    tabletStartupScreen: 'tablet_startup.png',
    phoneStartupScreen: 'phone_startup.png',
    glossOnIcon: false,
    onReady: function() {

        var searchField = new Ext.form.Search({
            name : 'search',
            placeHolder: 'Search',
            useClearIcon: true,

            onClearIconTap: function() {
                if (!this.disabled) {
                    this.setValue('');
                    console.log('onClearTap: Clear button tapped!');                       
                }
            }
        });

        var viewport = new Ext.Panel({
            fullscreen: true,
            dockedItems: [{
                xtype: 'toolbar',
                dock: 'top',
                items: [searchField]
            }]
        });

        console.log(searchField.useClearIcon);

        searchField.mon(searchField.clearIconContainerEl, {
            scope: searchField,
            tap: function() {
                if (!this.disabled) {
                    console.log('clearIconContainerEl: Clear button tapped!');
                }
            }
        });
    }
});
1 голос
/ 03 сентября 2012

Проблема в том, что маленький X не добавляется сенсорным Сенча.Это особенность ввода «поиск» с html5.Для захвата этого события вам нужно искать поисковое событие.Как я решил это, я отредактировал sencha-touch.js

Я изменил - 

    if (this.fieldEl) {
        this.mon(this.fieldEl, {
            focus: this.onFocus,
            blur: this.onBlur,
            keyup: this.onKeyUp,
            paste: this.updateClearIconVisibility,
            mousedown: this.onBeforeFocus,
            scope: this
        });

, чтобы он был - 

    if (this.fieldEl) {
        this.mon(this.fieldEl, {
            focus: this.onFocus,
            blur: this.onBlur,
            keyup: this.onKeyUp,
            paste: this.updateClearIconVisibility,
            mousedown: this.onBeforeFocus,
            search: this.onSearch,
            scope: this
        });

внутри Ext.form.Text =Ext.extend (Ext.form.Field, {...

Теперь в моей реализации поля поиска я могу создать функцию onSearch, которая будет вызываться при вызове события search). Обратите внимание, чтоСобытие «search» вызывается не только для X, но и для некоторых вещей, таких как клавиша ввода. Суть в том, что sencha touch 1.1 вообще не проверяет это событие, и это единственный раз, когда X запускает событие, поэтому единственное решениеизменить sencha-touch.js.

1 голос
/ 01 ноября 2011

Для пользователей sencha touch 2.0:

Если вы используете новую структуру mvc, вы можете использовать ее в контроллере init 

this.control({    
     '#yourTextFieldId clearicon': {
          tap: function(){console.log('ClearICON tapped');}
     }
....
)};
...