Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations IamaSherpa on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

How do I make these buttons smartphone friendly? 1

Status
Not open for further replies.

hitsuin

Vendor
Aug 23, 2010
24
GB
Hi everyone, I hate to be a burden but I'm back again, I hope to actually be able to help others on here on day. I'm writing a page for phones like the iPhone. The page manipulates data in the textbox and writes the answer to the innerhtml. The form doesn't submit data anywhere and the page doesn't reload. Because I hate the smaller buttons, and having to zoom in and out, the buttons hide and are in their own individual divs.

Upon trying the page in apple the page worked but only if, after entering the text, the "go" promt on the iPhone is avoided. No one will do that. From what I gather online the best thing to use is the onsubmit event. However, I don't know how to use submit, especially not with buttons like these and the page shouldnt reload anyway.

This is what I have, what do you guys suggest?

Code:
<form>
<p align="center"><input id="paths" maxlength="12" size=12 name=textbox  ></p></div>
<div id="1button" ><a onclick="Processing1();"><img src="1.jpg" alt="1" /></a></div>
<div id="2button" ><a onclick="Processing2();"><img src="2.jpg" alt="2" /></a></div>
<div id="3button" ><a onclick="Processing3();"><img src="3.jpg" alt="3" /></a></div></form>
 
Since you aren't submitting anything, you can do away with your form, that way there's no form to actually submit, and you don't get the GO button on the iPhone's on-screen keyboard. Instead you get a simple return key. Alternatively you can use the onsubmit event on your form and just return a false value to avoid submission. This however has the confusing side effect of not making the keyboard go away after clicking Go. So the users would have to tap outside the keyboard to remove it.

Code:
<form onSubmit="return false;">



----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.
 
Thanks Vacunita, I had to wait until I could get into apple and back to know the result.... I think I've thanked you the most out of everyone here but thanks again.
 
Glad I could help.

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top