iOS web app GO keyboard button doesn't submit Ajax form

Question

I have this iOS web app, that needs to submit a form through Ajax, which works for the most part. The only thing that isn't working is that the GO button on the keyboard doesn't respond.

On desktop browser, everything works for submitting (submit button, or enter key)

On Safari iOS, everything works fine too (submit button, GO keyboard button)

But when using it as a Web App on iOS, the GO button doesn't work!

What could cause this behaviour? An iOS web app still uses Safari as far as I know... :)

<form id="myForm" name="form" action="link-to-script.php" method="post">
<table>
    <tr>
        <td><input id="name" name="name" type="text" size="20" maxlength="25" /></td>
    </tr>
    <tr>
        <td><input id="email" name="email" type="text" size="20" maxlength="50" /></td>
    </tr>
    <tr>
        <td><input type="submit" name="Submit" value="Send" /></td>
    </tr>
</table>

$('#myForm').submit(function(e) {
    e.preventDefault();  // Doesn't matter
    var dataString = $(this).serialize();
    $.ajax({
        type: "POST",
        url: "http://link-to-script.php?",  // Valid link for the use of this form
        cache: false,
        data: dataString,
        success: function() {

        }
    });
});

UPDATE (SOLVED): I've removed the preventDefault() again. It wasn't bottlenecking me, but I don't like unneccessary code. :)

When I added return false; at the bottom of my $('#myForm').submit(function() {, everything worked like I wanted it to.

iOS GO button, Enter, and Submit button all respond now.

Answer 1

I've discovered that adding a target="_blank" to a tag will break the Go button on the iOS keyboard.

Answer 2

Have you tried hooking to "Done/enter" button:

$("#myForm input").live("keyup", function(evt) {
  if (evt.keyCode === 13) {
    $("#myForm").trigger("submit");
  }
});