auto-focus on field on iPhone

timstring

Does iOS 5 allow for autofocusing on a field?

Ashley_Sheridan

How do you mean autofocus on a field? Have you tried using Javascript to focus on the element from an onload event?

timstring

I mean that the cursor is already in the form field and the keyboard already up. here's the code:

<input type="txt" name="TechEntry" autofocus/><br />

This works inside the Safari 5.0.6 on my desktop, but not on the iPhone.

and I have also tried:

<body onload = 'setTimeout(function(){
    input.focus();
},500);'>

and it doesn't work on my desktop

and

<body onload='setTimeout("document.Login.txt.focus()",750);'>

and it don't work either

I will admit that Java is over my head for the moment

In my research, I have found that focusing on a field is impossible, but the newest article I found was from last year. I'm just wondering if Apple changed their minds with iOS 5.

Weedpacket

Here's a post from someone with the same issue. An excerpt from the recommended answer:

As of iOS 5, handlers triggered by synthesised click events are allowed to trigger focus on input elements.

timstring wrote:
I will admit that Java is over my head for the moment

Not to worry, JavaScript is a hugely different language.

Ashley_Sheridan

The two Javascript examples you gave won't work on any browser, let alone an iPhone, and I'm not sure why you are putting the timeout in there either, as you're calling the code from the onload event, which means the DOM has loaded by then, so there's no need to wait.

Try something like this:

<body onload="document.getElementById('autofocus_field').focus()">
<input type="txt" name="TechEntry" autofocus/>

timstring

Ashley, I put the 'setTimeout' commands because they were the two examples i found that I could understand. I am not understanding the 'onload' statement. I know I'm supposed to put the field name somewhere in the code. I tried replacing the 'autofocus_field', but it doesn't work on mobile Safari either.

Weedpacket, I had dredged up that page in stackoverflow.com. It's over my head. His example doesn't work on my desktop nor my iphone. He doesn't give any code for his web page, and I can't figure out his script from looking at the source code in Safari.

Bonesnap

timstring;11016327 wrote:
Ashley, I put the 'setTimeout' commands because they were the two examples i found that I could understand. I am not understanding the 'onload' statement. I know I'm supposed to put the field name somewhere in the code. I tried replacing the 'autofocus_field', but it doesn't work on mobile Safari either.

Weedpacket, I had dredged up that page in stackoverflow.com. It's over my head. His example doesn't work on my desktop nor my iphone. He doesn't give any code for his web page, and I can't figure out his script from looking at the source code in Safari.

The onload statement is simply telling the browser that when the page loads, do this, whatever this may be. In your case, put focus on a particular field.

This code should work:

<body onload="document.getElementById('focus-field').focus();">
    <input type="text" id="focus-field" />
</body>

Note the argument for "getElementById" and the ID attribute of the input field. They're the same, as you might expect.

Ashley_Sheridan

Oops, I forgot to add the ID in on my last example!