Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

<input type="search"> not working on iPhone Mobile Safari

Supposedly in HTML5 in Safari, you can define your input type as "search" and when the user starts typing, an X button will show up to allow them to clear, much like the Google search bar in Safari. On my website, this works on desktop Safari but it doesn't work in Mobile Safari.

    <input id="termsField" type="search" autocorrect="off" placeholder="Type something here">

//This is the code for the X button I have to use now since HTML5 doesn't work
<INPUT type="image" name="Clear" alt="Clear" src="clearX.png" height="22" width="22"
        onClick="clearText(this)">

At first I thought it's because I have a Jquery autocomplete function on the #termsField but again if it works in Desktop Safari that wouldn't be the case. Does anyone have any idea why this might be happening? Also, it doesn't work either on my iPhone or in the iPhone Simulator in XCode so it's not an issue specifically with my iPhone.

like image 767
sxflynn Avatar asked Nov 15 '10 17:11

sxflynn


1 Answers

That works in (Desktop) Safari, but not on the iPhone (Mobile Safari). You can mimic the functionality via some clever javascript.

like image 112
ceejayoz Avatar answered Sep 21 '22 00:09

ceejayoz