View Full Version : How to add scroll event to Ext.form.FormPanel?

19 Sep 2010, 5:04 PM
Trying to get rid of bug in Sencha Form example (1 (http://dev.sencha.com/deploy/touch/examples/forms/), 2 (http://dev.sencha.com/deploy/touch/examples/forms/)).

When form is loaded on iPad, landscape mode, cursor is set to one of text fields (keyboard active) and form is scrolled up or down - cursor is shown in front of all form elements, scrolling with all form, instead of staying in text field.

I think, that I can avoid this in my application, by adding some sort of event handler that can hide keyboard right after scrolling started (moving focus to submit button), but can't find a way to add this event to my form.

So, the question is: How to add onScroll or touchMove event to Sencha Form example?

19 Sep 2010, 7:11 PM
Listen to the scroller:

new Ext.Panel({
scroll: 'vertical',
listener: {
afterrender: function(c){
c.scroller.on('scroll', function(){
// do stuff

1 Jun 2011, 2:38 AM
I created the Customer Registration form with 16 fields, so some of the fields cannot see. So I added the autoscroll: true , but still cannot some of the code is below

mPOS.views.CustomerReg = Ext.extend(Ext.Panel, {
autoscroll: true,
initComponent: function() {
this.items = [{
xtype: 'fieldset',
instructions: 'Pleas Fill Customer Information',
scroll: 'vertical',
defaults: {
labelWidth: '30%'
items: [{
xtype: 'textfield',
id: 'CompanyName',
label: 'Company Name',
name: 'companyname',
required: true

Please help me, I am very new to sencha touch. I start to learn it last 2 weeks.

17 Jan 2013, 1:58 AM
I have Ext.grid.Panel component and I am adding scroll event to it with the following way,<br>
<br>afterrender: {<br>&nbsp; &nbsp; &nbsp; fn: function(s){<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;s.scroller.on('scroll',function(){<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;console.log('111111111'); &nbsp;&nbsp;<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }) ;<br>&nbsp; &nbsp; }<br>}<br>but it does not log anything in console.