Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Go vs. return button in iOS keyboard for HTML input forms

Managing the iOS keyboard for HTML <input> forms (used in UIWebView) is well known, i.e. <input type="tel"></input> for telephone numbers.

https://developer.apple.com/library/ios/documentation/StringsTextFonts/Conceptual/TextAndWebiPhoneOS/KeyboardManagement/KeyboardManagement.html

But I was wondering about the keyboard's blue 'Go' button. Sometimes the keyboard has a blue 'Go' button, sometimes the keyboard has a gray return button. Is there any opportunity to control this behavior programmatically?

like image 434
AppsolutEinfach Avatar asked Apr 10 '14 11:04

AppsolutEinfach


1 Answers

Update 2020/2021

As Cameron Cobb pointed out, Safari Mobile supports the new HTML attribute enterkeyhint since version 13.7 ~ Sept. 2020 (https://caniuse.com/mdn-html_global_attributes_enterkeyhint).

The following values are possible (https://mixable.blog/ux-improvements-enterkeyhint-to-define-action-label-for-the-keyboard-of-mobile-devices/):

<input enterkeyhint="enter"> <input enterkeyhint="done"> <input enterkeyhint="go"> <input enterkeyhint="next"> <input enterkeyhint="previous"> <input enterkeyhint="search"> <input enterkeyhint="send"> 

Original Answer

Aha...

The 'Go' button is only shown, if the <input> tag is inside a <form> tag (and the form tag has an action attribute). So, if you access your form elements afterwards with i.e. JavaScript, you can omit <form> tags.

'Go' button:

<form action="..." method="...">    <input type="text"></input> </form> 

iOS 7.1 screenshot of keyboard

'return' button:

<input type="text"></input> 

iOS 7.1 screenshot of keyboard

like image 64
AppsolutEinfach Avatar answered Sep 18 '22 02:09

AppsolutEinfach