Как прокрутить вниз в сетке Ext JS 3.4?
У меня есть панель сетки (с панелью Ext.ux.grid.RowEditor внутри), и я хочу прокрутить вниз (около дна мой Ext.ux.grid.RowEditor не отображается полностью),
этот кусок кода не работает:
this.MyGrid.getView().on('scrollToBottom', function(){
var inputEl = this.MyGrid.el.dom;
inputEl.scrollTop = inputEl.scrollHeight;
}, this);
.....
а затем при нажатии кнопки "Сохранить" я запускаю событие:
this.MyGrid.getView().fireEvent('scrollToBottom',this);
Есть идеи, почему это не прокрутка? Спасибо!
3 ответа
Я нашел решение! никаких дополнительных событий и слушателей, просто
var inputEl = this.myGrid.getView().scroller.dom;
inputEl.scrollTop = inputEl.scrollHeight;
.on()
Функция используется для настройки функции слушателя для события, а не для добавления пользовательского события. Точно так же .fireEvent()
Функция используется для запуска события на объекте. AFAIK, вы не можете определить свои собственные события, и в ExtJ нет события scrollToBottom.
Что вы хотите сделать, это определить свой код scrollToBottom как функцию, а затем вызвать ее из обработчика нажатия кнопки сохранения
Пожалуйста, попробуйте добавить событие в вашу сетку, используя метод addEvent (используя init), а затем добавьте событие в качестве слушателя в вашу сетку. Запустите событие всякий раз, когда это необходимо (в вашем случае, когда пользователь нажимает кнопку "Сохранить"), используя метод fireEvent, и подпишитесь на него в вашем слушателе.
Пример кода выглядит следующим образом (Вы должны добавить это событие, а затем запустить его.) Добавление события в компонент init выглядит следующим образом (ниже это относится к области сетки)
this.addEvents('SCROLL_TO_BOTTOM');
Вы должны подписаться на событие и установить высоту прокрутки для вашей сетки. Добавьте ниже слушателя к вашей сетке.
listeners: {
'SCROLL_TO_BOTTOM': this.handleScroll,
scope: this
}
Функция для обработки прокрутки
handleScroll:function(){
var inputEl = this.MyGrid.el.dom;
inputEl.scrollTop = inputEl.scrollHeight;
}
Надеюсь, это поможет вам...