Results 1 to 4 of 4

Thread: How to add scroll event to Ext.form.FormPanel?

  1. #1
    Ext User
    Join Date
    Dec 2008
    Posts
    2
    Vote Rating
    0
      0  

    Default How to add scroll event to Ext.form.FormPanel?

    Trying to get rid of bug in Sencha Form example (1, 2).

    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?

  2. #2
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    18,382
    Vote Rating
    858
      0  

    Default

    Listen to the scroller:

    Code:
    new Ext.Panel({
        scroll: 'vertical',
        listener: {
            afterrender: function(c){
                c.scroller.on('scroll', function(){
                    // do stuff
                });
            }
        }
    });
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

  3. #3
    Sencha User
    Join Date
    May 2011
    Location
    Singapore
    Posts
    3
    Vote Rating
    0
      0  

    Default Cannot scroll through form ... help me !!!!!!!! :(

    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.id='CustomerRegistration',
    this.url='loadCustomer.php?action=save',
    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.

  4. #4
    Sencha User
    Join Date
    Feb 2012
    Location
    Georgia, Tbilisi
    Posts
    4
    Vote Rating
    0
      0  

    Default Is it the same way to add scroll event to Ext.grid.Panel?

    I have Ext.grid.Panel component and I am adding scroll event to it with the following way,<br>
    Code:
    <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.

Similar Threads

  1. How to add Scroll bar to the control Ext.ux.form.MultiSelect
    By chullan in forum Ext 3.x: Help & Discussion
    Replies: 2
    Last Post: 24 Feb 2011, 2:27 PM
  2. add link to registration form in login formpanel
    By concep86 in forum Ext 2.x: Help & Discussion
    Replies: 6
    Last Post: 4 May 2010, 10:42 PM
  3. [2.2.1] Ext.form.FormPanel and "render" event
    By nassaja-rus in forum Ext 2.x: Help & Discussion
    Replies: 2
    Last Post: 18 Apr 2009, 2:24 AM
  4. How to add scroll bar to the form-markup.js
    By sunilraj in forum Community Discussion
    Replies: 1
    Last Post: 23 Aug 2008, 9:42 PM
  5. [Ext 2.0] Ext.FormPanel doesn't add fields to form
    By mdissel in forum Ext 2.x: Help & Discussion
    Replies: 3
    Last Post: 9 Jul 2007, 2:39 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •