Getting iPhone GO button to submit form

So, here was our specific issue:

We had a form with multiple user input fields, but not a true <input type="submit"> (it was being submitted via JS).

As such, the GO button did nothing.

We then added an <input type="submit"> and set it to display: none hoping that would do the trick. Nope. Didn't work.

On a whim, we changed display: none to margin-left: -1000px

That worked!

Apparently, Safari is looking for the presence of a SUBMIT button in the form and only if it's not display: none, it will then fire it when you hit the GO button.

I could not work out why a very simple google maps form was not submitting using the iPhone Go button.

Turns out, after stripping it down, it does not work with target="_blank" on the form tag.

Removed that, and now the Go button works on iPhone.

Here's a JSFiddle to try it

You can also bind a keypress listener to the element or form. The iphone "Go" button is the same as the enter button on a computer, char 13.

$('someElem').bind("keypress", function(e){
    // 'Go' key code is 13
    if (e.which === 13) {
       console.log("user pressed Go");
       // submit your form with explicit JS.
    } 
 });

If there are more than one inputs and you want to hide the submit, the best seems:

<input type="submit" style="visibility:hidden;position:absolute"/>