Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 19.04.2015, 00:34
Аватар для khusamov
Соединяю Node.js и Ext JS
Отправить личное сообщение для khusamov Посмотреть профиль Найти все сообщения от khusamov
 
Регистрация: 25.06.2009
Сообщений: 1,033

Component Focus & Blur
Здравствуйте!

Почему если вызвать метод component.focus() не генерируется событие focus у этого компонента?

Или как пользоваться этими событиями и методами компонент: Focus & Blur?
Ответить с цитированием
  #2 (permalink)  
Старый 19.04.2015, 12:43
Профессор
Отправить личное сообщение для novikov Посмотреть профиль Найти все сообщения от novikov
 
Регистрация: 19.11.2012
Сообщений: 178

странно, конечно, но в документации написано, что вызов focus() приводит к генерации события tofront.

http://docs.sencha.com/extjs/5.1/5.1...t-method-focus

А пользоваться так. Нужно в определении компонента написать свою реализацию шабонного метода postFocus или postBlur:

/**
     * Template method to do any post-focus processing.
     * @protected
     * @param {Ext.event.Event} e The event object
     */
    postFocus: Ext.emptyFn,


http://docs.sencha.com/extjs/5.1/5.1...thod-postFocus

Хотя лично у меня нет опыта работы с postFocus. Напишите, помогло ли это решение.
Ответить с цитированием
  #3 (permalink)  
Старый 19.04.2015, 21:24
Аватар для khusamov
Соединяю Node.js и Ext JS
Отправить личное сообщение для khusamov Посмотреть профиль Найти все сообщения от khusamov
 
Регистрация: 25.06.2009
Сообщений: 1,033

Странно то, что события tofront тоже вроде как нет. По крайней мере по документации.

Писать методы post* страннно как-то...

Я думал как использовать: Если я выделил объект на экране, то он в фокусе. Если я выделил какой другой объект и вызвал у него метод focus, то предыдущий объект тут же теряет фокус. Это удобно тем, что мне не нужно специально искать какой же объект сейчас в фокусе, снимать с него фокус и ставить фокус на объект, который сейчас пытаемся выделить.

Я думал что такая стандартная функция уже реализована...

Похоже придется дописать эту функцию... для всех компонент. Надеюсь без override.
Ответить с цитированием
  #4 (permalink)  
Старый 19.04.2015, 23:30
Аватар для khusamov
Соединяю Node.js и Ext JS
Отправить личное сообщение для khusamov Посмотреть профиль Найти все сообщения от khusamov
 
Регистрация: 25.06.2009
Сообщений: 1,033

Попробовал эту штуку

To activate the FocusManager, simply call Ext.FocusManager.enable();. In turn, you may deactivate the FocusManager by subsequently calling Ext.FocusManager.disable();. The FocusManager is disabled by default.

http://docs.sencha.com/extjs/5.1/5.1...-method-enable

Но к сожалению на строке Ext.FocusManager.enable(); выдает ошибку. В чем там проблема пока не ясна, уж больно велик стек))))
Ответить с цитированием
  #5 (permalink)  
Старый 19.04.2015, 23:35
Аватар для khusamov
Соединяю Node.js и Ext JS
Отправить личное сообщение для khusamov Посмотреть профиль Найти все сообщения от khusamov
 
Регистрация: 25.06.2009
Сообщений: 1,033

Нашел способ вставки команды. Если так записать, то ошибки уже нету:
Ext.onReady(function() {
	Ext.FocusManager.enable();
...


Но к сожалению это ничего не дало. События focus|blur не появляются.
Ответить с цитированием
  #6 (permalink)  
Старый 20.04.2015, 00:15
Аватар для khusamov
Соединяю Node.js и Ext JS
Отправить личное сообщение для khusamov Посмотреть профиль Найти все сообщения от khusamov
 
Регистрация: 25.06.2009
Сообщений: 1,033

Нашел опцию

http://docs.sencha.com/extjs/5.1/5.1...erty-focusable

Поставил в своих компонентах равной true.

И снова не работает...

Что еще нужно сделать, чтобы этот механизм троклятый заработал?
Ответить с цитированием
  #7 (permalink)  
Старый 20.04.2015, 00:57
Аватар для khusamov
Соединяю Node.js и Ext JS
Отправить личное сообщение для khusamov Посмотреть профиль Найти все сообщения от khusamov
 
Регистрация: 25.06.2009
Сообщений: 1,033

Вот пример https://fiddle.sencha.com/#fiddle/lgf

console.clear();

Ext.FocusManager.enable(true);

Ext.define("MyComponent", {
    
    extend: "Ext.Component",
    
    focusable: true
    
});

var comp = Ext.create("MyComponent", {
    renderTo: Ext.getBody(),
    html: "Тестовый компонент"
});

comp.on("focus", function() {
    console.log("FOCUS");
});

comp.on("blur", function() {
    console.log("BLUR");
});



comp.focus();
comp.blur();


Пока это дело не работает.

Может из-за того, что элементом компонента является DIV?
Ответить с цитированием
  #8 (permalink)  
Старый 20.04.2015, 08:39
Профессор
Отправить личное сообщение для novikov Посмотреть профиль Найти все сообщения от novikov
 
Регистрация: 19.11.2012
Сообщений: 178

Да, точно. Нужно ещё писать focusable.

Ext.application({
    name : 'Fiddle',

    launch : function() {

        Ext.define("MyComponent", {
            extend: "Ext.Component",
            focusable: true,
            onFocus: function() {
                alert(1);
                this.callParent(arguments);
                
            },
            postFocus: function() {
                alert(2);
            }
            
        });
        
        var comp = Ext.create("MyComponent", {
            renderTo: Ext.getBody(),
            html: "Тестовый компонент"
        });
        
        comp.focus();

    }
});



фидл
Ответить с цитированием
  #9 (permalink)  
Старый 20.04.2015, 09:59
Аватар для khusamov
Соединяю Node.js и Ext JS
Отправить личное сообщение для khusamov Посмотреть профиль Найти все сообщения от khusamov
 
Регистрация: 25.06.2009
Сообщений: 1,033

1) Не работает. Алерты не всплывают. У вас этот пример что, работающий?

2) И самого главного нет - генерации событий focus|blur!
Ответить с цитированием
  #10 (permalink)  
Старый 20.04.2015, 10:04
Аватар для khusamov
Соединяю Node.js и Ext JS
Отправить личное сообщение для khusamov Посмотреть профиль Найти все сообщения от khusamov
 
Регистрация: 25.06.2009
Сообщений: 1,033

Так... я подставил вместо DIV тег INPUT и все заработало. Оказывается целевой элемент должен поддерживать focus/blur. DIV не может быть фокусируемым, а вот INPUT может. Теперь ясно в чем проблема... Правда не ясно что делать, если у меня компонент допустим окно. Оно ведь на DIV-ах построено же... Есть ли какой-нибудь безобидный тег, поддерживаемый focus/blur?
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Blur и Focus Phoenix13 Events/DOM/Window 6 19.11.2014 00:01
Разметка для Google closure compiler monolithed Оффтопик 11 04.09.2013 00:50
Плагин PlantUML B~Vladi Оффтопик 49 22.08.2012 16:03
При повторном фокусе добавляются события blur и keydown sdaww Events/DOM/Window 2 05.07.2012 15:15
события focus и blur AdeL1ne jQuery 1 24.09.2011 09:26