Search Input Field and Keybord

1,786 views
Skip to first unread message

abritez

unread,
Jan 19, 2010, 2:08:27 PM1/19/10
to phonegap
I've tried using <input type="search" /> with no luck. I also know
that i could get around the visual aspect of the input field via CSS
& Javascript, however how do i get the Keybord to have a "SEARCH"
button on the bottom right instead of it saying "RETURN"

Jesse MacFadyen

unread,
Jan 19, 2010, 4:19:53 PM1/19/10
to abritez, phonegap
The following are supported in mobile safari, and therefore PhoneGap since iPhone OS 3.1

<!-- display a standard keyboard -->
<p>Text: <input type="text" /> </p>
<!-- display a telephone keypad -->
<p>Telephone: <input type="tel" />  </p>
<!-- display a URL keyboard -->
<p>URL: <input type="url" />  </p>
<!-- display an email keyboard -->
<p>Email: <input type="email" />  </p>
<!-- display a numeric keyboard -->
<p>Zip Code: <input type="text" pattern="[0-9]*" />  </p>

Search is not supported as an input type, and would require considerable native work to make happen in PhoneGap.


--
You received this message because you are subscribed to the Google
Groups "phonegap" group.
To post to this group, send email to phon...@googlegroups.com
To unsubscribe from this group, send email to
phonegap+u...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/phonegap?hl=en?hl=en

For more info on PhoneGap or to download the code go to www.phonegap.com



--
Jesse MacFadyen

blogs.nitobi.com/jesse
jesse.m...@nitobi.com

Harrison

unread,
Jan 19, 2010, 11:47:59 PM1/19/10
to phonegap
<form action="/">
<input type="search" style="-webkit-appearance:searchfield;">
</form>

Will produce a keyboard that says "search" instead of return.

I haven't tried this in PhoneGap, but I have just verified it in
MobileSafari, so I assume it would work in PhoneGap.


On Jan 20, 10:19 am, Jesse MacFadyen <jesse.macfad...@nitobi.com>
wrote:


> The following are supported in mobile safari, and therefore PhoneGap since
> iPhone OS 3.1
>
> <!-- display a standard keyboard -->
> <p>Text: <input type="text" /> </p>
> <!-- display a telephone keypad -->
> <p>Telephone: <input type="tel" />  </p>
> <!-- display a URL keyboard -->
> <p>URL: <input type="url" />  </p>
> <!-- display an email keyboard -->
> <p>Email: <input type="email" />  </p>
> <!-- display a numeric keyboard -->
> <p>Zip Code: <input type="text" pattern="[0-9]*" />  </p>
>
> Search is not supported as an input type, and would require considerable
> native work to make happen in PhoneGap.
>
>
>
> On Tue, Jan 19, 2010 at 11:08 AM, abritez <abri...@gmail.com> wrote:
> > I've tried using <input type="search" /> with no luck.  I also know
> > that i  could get around the visual aspect of the input field via CSS
> > & Javascript, however how do i get the Keybord to have a "SEARCH"
> > button on the bottom right instead of it saying "RETURN"
>
> > --
> > You received this message because you are subscribed to the Google
> > Groups "phonegap" group.
> > To post to this group, send email to phon...@googlegroups.com
> > To unsubscribe from this group, send email to

> > phonegap+u...@googlegroups.com<phonegap%2Bunsu...@googlegroups.com>


> > For more options, visit this group at
> >http://groups.google.com/group/phonegap?hl=en?hl=en
>
> > For more info on PhoneGap or to download the code go towww.phonegap.com
>
> --
> Jesse MacFadyen
>
> blogs.nitobi.com/jesse

> jesse.macfad...@nitobi.com

Jesse MacFadyen

unread,
Jan 21, 2010, 6:30:23 AM1/21/10
to Harrison, phonegap
I have verified that type="search" works as Harrison states in
phonegap iPhone apps.
The only gotcha is that the search field must be inside a form tag.
All other types work by placing the input field anywhere.

Sent from my iPhone

On 2010-01-19, at 8:47 PM, Harrison <harrison....@gmail.com>
wrote:

Reply all
Reply to author
Forward
0 new messages