[TIMOB-17693] iOS: Support missing properties for UITextField inside Ti.UI.AlertDialog

GitHub Issue	n/a
Type	New Feature
Priority	Medium
Status	Closed
Resolution	Fixed
Resolution Date	2015-10-16T20:57:40.000+0000
Affected Version/s	Release 3.3.0
Fix Version/s	Release 5.1.0
Components	iOS
Labels	TSP, supportTeam
Reporter	Marco Cota
Assignee	Hans Knöchel
Created	2014-09-15T21:31:26.000+0000
Updated	2015-10-19T22:25:41.000+0000

Description

Request

Customer is asking to add keyboardType support to createAlertDialog in iOS. When an AlertDialog is created in iOS with PLAIN_TEXT_INPUT is showing UIKeyboardTypeDefault, in certain use cases is required to use other keyboards like the numberPad (Zip Code search, PIN code).

Additional info

This behaviour is possible in native iOS projects like this:

UIAlertView * alert = [[UIAlertView alloc] initWithTitle:@"Hello!" message:@"Please enter your name:" delegate:self cancelButtonTitle:@"Continue" otherButtonTitles:nil];
alert.alertViewStyle = UIAlertViewStylePlainTextInput;
UITextField * alertTextField = [alert textFieldAtIndex:0];
alertTextField.keyboardType = UIKeyboardTypeNumbersAndPunctuation;
alertTextField.placeholder = @"Enter your name";
[alert show];

Comments

Hans Knöchel 2015-09-09

* Introducing the placeholder property of UIAlertViewStylePlainTextInput * Introducing the loginPlaceholder and passwordPlaceholder properties of UIAlertViewStyleLoginAndPasswordInput with default value to "Login" and "Password" (as it was static before). * Introducing the keyboardType property using the existing Titanium.UI.KEYBOARD_* constants to be used in the alert dialog * Introducing the returnKeyType property using the existing Titanium.UI.RETURNKEY_* constants to be used in the alert dialog Everything covered?

Hans Knöchel 2015-09-09

*PR pending*: https://github.com/appcelerator/titanium_mobile/pull/7155 Demo code:

   var win = Ti.UI.createWindow({
   	backgroundColor : '#fff',
   	layout : 'vertical'
   });
   var btn1 = Ti.UI.createButton({
   	title : "Show input dialog!",
   	top : 50
   });
   var btn2 = Ti.UI.createButton({
   	title : "Show login dialog!",
   	top : 50
   });
   
   win.add(btn1);
   win.add(btn2);
   win.open();
   
   btn1.addEventListener("click", showInputDialog);
   btn2.addEventListener("click", showLoginDialog);
   
   function showInputDialog() {
   	var dialog = Ti.UI.createAlertDialog({
   		style : Titanium.UI.iPhone.AlertDialogStyle.PLAIN_TEXT_INPUT,
   		title : "TIMOB-17693",
   		message : "Hey there, what is your name?",
   		placeholder : "Enter your name ...",
   		keyboardType : Ti.UI.KEYBOARD_EMAIL,
   		returnKeyType : Ti.UI.RETURNKEY_DONE
   	});
   
   	dialog.show();
   }
   
   function showLoginDialog() {
   	var dialog = Ti.UI.createAlertDialog({
   		style : Titanium.UI.iPhone.AlertDialogStyle.LOGIN_AND_PASSWORD_INPUT,
   		title : "TIMOB-17693",
   		message : "Hey there, please authenticate!",
   		loginPlaceholder : "Your E-Mail ...",
   		passwordPlaceholder : "Your Password ..."
   	});
   
   	dialog.show();
   }

Chee Kiat Ng 2015-09-14

CR and FT passed. PR merged.
Eric Wieber 2015-10-14

[~hansknoechel] Everything looks good except that I am unable to set the keyboard type or returnkey type when the style of the alert is LOGIN_AND_PASSWORD_INPUT. It seems to default to the standard keyboard and return key. Is this intentional? Since many logins use an email address for the username, it would be nice to be able to set the keyboard to the email style. Tested using: MacOS 10.11 (15A284) Studio 4.4.0.201510092420 Ti SDK 5.1.0.v20151013151603 Appc NPM 4.2.1-1 Appc CLI 5.1.0-38 Ti CLI 5.0.5 Alloy 1.7.16 Arrow 1.3.13 Xcode 7.0.1 (7A1001) Node v4.1.0 Java 1.7.0_80 production

Hans Knöchel 2015-10-16

PR (master): https://github.com/appcelerator/titanium_mobile/pull/7308 PR (5_1_X): https://github.com/appcelerator/titanium_mobile/pull/7309 Updated the example to support dynamic configuration of keyboard and returnkey using the Ti.UI.iPhone.AlertDialogStyle.LOGIN_AND_PASSWORD_INPUT style:

   	var dialog = Ti.UI.createAlertDialog({
   		style : Titanium.UI.iPhone.AlertDialogStyle.LOGIN_AND_PASSWORD_INPUT,
   		title : "TIMOB-17693",
   		message : "Hey there, please authenticate!",
   		loginPlaceholder : "Your E-Mail ...",
   		loginKeyboardType: Ti.UI.KEYBOARD_EMAIL,
   		loginReturnKeyType: Ti.UI.RETURNKEY_NEXT,
   		passwordPlaceholder : "Your Password ...",
   		passwordKeyboardType: Ti.UI.KEYBOARD_ASCII,
   		passwordReturnKeyType: Ti.UI.RETURNKEY_DONE,
   	});
           dialog.show();

Angel Petkov 2015-10-16

PR's Approved and Merged. Thanks!
Eric Wieber 2015-10-19

Verified fixed, using: MacOS 10.11 (15A284) Studio 4.4.0.201510161811 Ti SDK 5.2.0.v20151018201232 Appc NPM 4.2.1-5 Appc CLI 5.1.0-38 Ti CLI 5.0.5 Alloy 1.7.16 Arrow 1.3.13 Xcode 7.0.1 (7A1001) Node v0.12.7 Java 1.7.0_80 production In addition to previous tests the keyboards and return keys are now customizable as well.

JSON Source