Hybrid View

    You found a bug! We've classified it as TOUCH-1941 . We encourage you to continue the discussion and to find an acceptable workaround while we work on a permanent fix.
  1. #1
    Sencha Premium Member
    Join Date
    Feb 2012
    Posts
    36
    Vote Rating
    2
    mangvlad is on a distinguished road

      0  

    Default TextArea scroll on iOS not working

    On any iOs device, when text area is used there is not way to scroll it...

    In Sencha Touch 1 this was posted as a fix:

    Code:
    // overrides a class and preserves overridden functions in a new property of the prototype, 'original'
    Ext.overrideOriginal = function(obj, overrides) {
    	var original = {};
    
    
    	for(prop in overrides)
    		if(overrides.hasOwnProperty(prop) && Ext.isFunction(obj.prototype[prop]))
    			original[prop] = obj.prototype[prop];
    
    
    	Ext.override(obj, Ext.applyIf(overrides, { original: original }));
    };
    
    
    Ext.overrideOriginal(Ext.form.TextArea, !Ext.is.iOS ? {} : {
    	lastY: undefined,
    
    
    	handleTouch: function(e) { this.lastY = e.pageY; },
    
    
    	handleMove: function(e) {
    		var textArea = e.target;
    		var top = textArea.scrollTop <= 0;
    		var bottom = textArea.scrollTop + textArea.clientHeight >= textArea.scrollHeight;
    		var up = e.pageY > this.lastY;
    		var down = e.pageY < this.lastY;
    
    
    		this.lastY = e.pageY;
    		
    // default (mobile safari) action when dragging past the top or bottom of a scrollable
    // textarea is to scroll the containing div, so prevent that.
    		if((top && up) || (bottom && down))
    			e.preventDefault();
    		
    // Sencha disables textarea scrolling on iOS by default,
    // so stop propagating the event to delegate to iOS.
    		if(!(top && bottom))
    			e.stopPropagation();
    	},
    
    
    	initEvents: function() {
    		var textArea = this.fieldEl.dom;
    // have to add these events directly to the DOM textarea (as opposed to this.fieldEl.on),
    // otherwise they're handled after Ext.gesture.Manager and preventDefault will already have been called.
    
    
    		textArea.addEventListener(
    			Ext.supports.Touch ? 'touchstart' : 'mousedown',
    			Ext.createDelegate(this.handleTouch, this),
    			false);
    		
    		textArea.addEventListener(
    			Ext.supports.Touch ? 'touchmove' : 'mousemove',
    			Ext.createDelegate(this.handleMove, this),
    			false);
    			
    		this.original.initEvents.apply(this, arguments);
    	},
    });
    Can this be adopted for Touch 2?

    Thanks.

  2. #2
    Sencha User Jamie Avins's Avatar
    Join Date
    Mar 2007
    Location
    Redwood City, California
    Posts
    3,661
    Vote Rating
    18
    Jamie Avins is a jewel in the rough Jamie Avins is a jewel in the rough Jamie Avins is a jewel in the rough

      0  

    Default

    We will review it and report back.

    Sencha Inc

    Jamie Avins

    @jamieavins

  3. #3
    Sencha User Jacky Nguyen's Avatar
    Join Date
    Jul 2009
    Location
    Palo Alto, California
    Posts
    469
    Vote Rating
    15
    Jacky Nguyen has a spectacular aura about Jacky Nguyen has a spectacular aura about

      0  

    Default

    We will be putting this in the library, but it will be after 2.0.0 release
    Sencha Touch Lead Architect

  4. #4
    Sencha Premium Member
    Join Date
    Feb 2012
    Posts
    36
    Vote Rating
    2
    mangvlad is on a distinguished road

      0  

    Default

    Any way there could be a temp fix for this, based on the code above?

  5. #5
    Sencha Premium Member
    Join Date
    Oct 2011
    Posts
    5
    Vote Rating
    0
    ricmelia is on a distinguished road

      0  

    Default

    Any ideas when a fix for this will be added to the library?

    The inability to scroll is the only negative feedback we're getting for our Touch application - the fix posted below for Touch 1 doesn't appear to work anymore (possibly due to iOS 5+ changing the gesture for scrolling textareas?).

    We'd like to upgrade to Touch 2 but don't want to spend the effort just yet if we're going to be left with this problem.

    Thanks

  6. #6
    Sencha User siebmanb's Avatar
    Join Date
    Aug 2011
    Location
    Geneva (CH) - Grenoble (FR)
    Posts
    253
    Vote Rating
    16
    siebmanb will become famous soon enough

      0  

    Default

    Just tried the sample code on iOS 5 and ST 1.x. It works great.

    Thank you

  7. #7
    Sencha User
    Join Date
    Apr 2010
    Posts
    4
    Vote Rating
    0
    cbryant is on a distinguished road

      0  

    Default Wrapped textarea in a scrollable container

    I was able to to get the text area to scroll (independently of its outer container), by wrapping it in a scrollable container. This also required including the code posted on this page into the application.

    Code:
        {
            xtype: 'container',
            itemId: 'commentsContainer',
            scrollable: {
                direction: 'vertical'
            },
            flex: 28,
            style: 'border: 1px solid #ccc;',
            items: [{
                xtype:'textareafield',
                id:'comments',
                itemId: 'comments',
                label: 'Comments',
                labelAlign: 'top',
                maxRows: 6,
                autoCapitalize: true,
                clearIcon: false,
                tabIndex: -1,                              
                lastY: undefined
           }]
        }


  8. #8
    Sencha User =NR='s Avatar
    Join Date
    Mar 2013
    Location
    Singapore
    Posts
    115
    Vote Rating
    0
    =NR= has a little shameless behaviour in the past

      0  

    Default

    no update on this issue ?

  9. #9
    Sencha User
    Join Date
    Nov 2013
    Location
    Ukraine
    Posts
    2
    Vote Rating
    0
    DangelZM is on a distinguished road

      0  

    Default

    no update on this issue?

  10. #10
    Sencha User
    Join Date
    Apr 2013
    Posts
    12
    Vote Rating
    0
    metric152 is on a distinguished road

      0  

    Default

    any news?