Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-15444] MobileWeb: Can't Type in TextFields inside ScrollableView

GitHub Issuen/a
TypeBug
PriorityLow
StatusClosed
ResolutionWon't Fix
Resolution Date2017-06-26T21:54:59.000+0000
Affected Version/sRelease 3.1.3
Fix Version/sn/a
ComponentsMobileWeb
Labelsn/a
Reporterowen melbourne
AssigneeChris Barber
Created2013-09-04T16:06:03.000+0000
Updated2018-04-04T23:20:37.000+0000

Description

Problem Description

If you have a TextField inside a scrollable view, when you try type in it on mobile web it just doesn't get focus, instead the scrollable view tries to scroll.

Steps to reproduce

1. Create a new mobile web project 2. Paste the code sample to app.js 3. Run in browser

Test case

/*
 * Single Window Application Template:
 * A basic starting point for your application.  Mostly a blank canvas.
 * 
 * In app.js, we generally take care of a few things:
 * - Bootstrap the application with any data we need
 * - Check for dependencies like device type, platform version or network connection
 * - Require and open our top-level UI component
 *  
 */
 
//bootstrap and check dependencies
if (Ti.version < 1.8 ) {
    alert('Sorry - this application template requires Titanium Mobile SDK 1.8 or later');       
}
 
// This is a single context application with multiple windows in a stack
(function() {
     
    var window = Ti.UI.createWindow({
        width: Ti.UI.Fill,
        height: Ti.UI.Fill,
        backgroundColor: 'blue'
    });
     
    var scrollableView = Ti.UI.createScrollableView({
        width: Ti.UI.Fill,
        height: Ti.UI.Fill,
        backgroundColor: 'yellow'
    });
     
    var view1 = Ti.UI.createView({
        backgroundColor: 'pink'
    });
     
    var textField = Ti.UI.createTextField({
        hintText: "Cant Focus On Me",
        backgroundColor: 'white',
        width: 300,
        height: 90,
        value: "cant change me!"
    });
     
    view1.add(textField);
     
    var view2 = Ti.UI.createView({
        backgroundColor: 'lime'
    });
     
    scrollableView.addView(view1);
    scrollableView.addView(view2);
    window.add(scrollableView);
     
     
     
    window.open();
})();

Extra comments

The bug is in the kitchen sink demo also if you add a TextField inside the ScrollableView demo, the above code should let you replicate the issue.

Attachments

FileDateSize
scrollableViewBug-Classic.zip2013-09-10T08:21:25.000+00002281917

Comments

  1. Mauro Parra-Miranda 2013-09-09

    Hello, can you provide a testcase with Titanium Classic? Which version of the Mobile SDK are you using? Best, Mauro
  2. owen melbourne 2013-09-10

    I've attached a demo app that contains the bug for you to see. We've tried it on Titanium SDK 3.1.2.GA and 3.1.1 and the bug happens in both. If the MobileSDK version is different, where can I find this? I've also pasted the content of app.js
       /*
        * Single Window Application Template:
        * A basic starting point for your application.  Mostly a blank canvas.
        * 
        * In app.js, we generally take care of a few things:
        * - Bootstrap the application with any data we need
        * - Check for dependencies like device type, platform version or network connection
        * - Require and open our top-level UI component
        *  
        */
       
       //bootstrap and check dependencies
       if (Ti.version < 1.8 ) {
       	alert('Sorry - this application template requires Titanium Mobile SDK 1.8 or later');	  	
       }
       
       // This is a single context application with multiple windows in a stack
       (function() {
       	
       	var window = Ti.UI.createWindow({
       		width: Ti.UI.Fill,
       		height: Ti.UI.Fill,
       		backgroundColor: 'blue'
       	});
       	
       	var scrollableView = Ti.UI.createScrollableView({
       		width: Ti.UI.Fill,
       		height: Ti.UI.Fill,
       		backgroundColor: 'yellow'
       	});
       	
       	var view1 = Ti.UI.createView({
       		backgroundColor: 'pink'
       	});
       	
       	var textField = Ti.UI.createTextField({
       		hintText: "Cant Focus On Me",
       		backgroundColor: 'white',
       		width: 300,
       		height: 90,
       		value: "cant change me!"
       	});
       	
       	view1.add(textField);
       	
       	var view2 = Ti.UI.createView({
       		backgroundColor: 'lime'
       	});
       	
       	scrollableView.addView(view1);
       	scrollableView.addView(view2);
       	window.add(scrollableView);
       	
       	
       	
       	window.open();
       })();
       
       
  3. owen melbourne 2013-09-19

    Is there any movement on this issue? As we've got a client relying on this, even if you can provide us with a fix that we can apply locally.
  4. Mauro Parra-Miranda 2013-10-10

    Hello Owen, bug confirmed, passed to the Platform team for review. Best, Mauro
  5. Lee Morris 2017-06-26

    Resolving as "Won't Fix" as MobileWeb has been deprecated.
  6. Eric Merriman 2018-04-04

    Closing as will not fix.

JSON Source