Submit form on go button click in android keyboard

Question

<form name="$root.deliveryDetails" action="#" ng-submit="ProceedForDelivery()">
    <h4>Login</h4>
        <div>
            <div ng-if="!askFor" class="paddingOnSides">
                <p>
                    <input type="number" name="usermobileNumber" ng-model="formData.userEnteredMobileNumber"  id="rounded" ng-minlength="10" ng-maxlength="10" ng-required="true" ng-pattern="/^\d{10}$/"  class="field" placeholder="Mobile Number:" ng-class="{LightText: contactDetails.mobileNumber.$pristine}"/>                                                            
                </p>
                <span class="error-message" ng-if="deliveryDetails.usermobileNumber.$dirty&& deliveryDetails.usermobileNumber.$invalid"> Please enter a 10 digit Mobile number</span>                  
                <div>
                    <span ng-disabled="deliveryDetails.$invalid" class="button button-positive button-block Centralize" ng-click="checkRegisteredUsers()"><span class="loginbuttonMargins">Verify</span><i class="ion-log-in"></i></span>
                </div>
            </div>
        </div>
        <input type="submit" style="position: absolute; left: -9999px; width: 1px; height: 1px;"/>
    </div><!--row-->
</form>

I am using Ionic and have added ng-submit as well as input type submit to the form , yet this form does not submit when Go button on keyboard is pressed.

Note: It redirects to default state the first time however, it works just fine in subsequent times. What could be the issue?

I had similar issue on click of a custom button (not from keyboard) and it fixes as soon as I changed it to tag from tag or may be change tag to

But what could be problem with keyboard click?

Answer 1

Because your input is a 'number' input, android for some reason changes the input to 'Next' instead of 'Go' and doesn't trigger the submit issue.

I had the same issue and fixed by adding a second, hidden input and attaching onfocus="$('#thisForm').submit();" to it. You can also hide this input with style="position: absolute; left: -9999px; width: 1px; height: 1px;" .

This isn't an ideal solution, but it does the trick on Android and iOS. Not sure why its so messed up by default on these keyboards.

Answer 2

Apparently, the problem is with the

action="#"

So If you remove that, then it should work.