CODEWITHSUNDEEP
javascriptjqueryiphonecordovajquery-mobile
user1891519
user1891519

Reputation: 31

jQuery Mobile 'Form' is not getting submitted from the iPhone soft keyboard "GO" button in PhoneGap

I am writing simple form with two text boxes for logIn process and wanted to get this form

submitted on the click of "Go" button of the i-Phone keyboard which get open as the textbox

gets focus.

When i keep a submit button with these two text boxes the go button starts working otherwise

it won't.

i am using

jQuery mobile v1.2.0

PhoneGap v2.5

code without submit button:

<form id="loginForm">

   <div class="ui-body">

      <div data-role="controlgroup" id="my-controlgroup">

          <input data-theme="b" type="text" name="text-username" id="text-username" placeholder="Username" value="" />

          <input data-theme="b" type="password" name="text-pwd" id="text-pwd"  placeholder="Password" value="" />

      </div>
   </div>

</form>

code with submit button:

<form id="loginForm" data-ajax="false">

   <div class="ui-body">

     <div data-role="controlgroup" id="my-controlgroup">

       <input data-theme="b" type="text" name="text-username" id="text-username"  placeholder="Username" value="" />

       <input data-theme="b" type="password" name="text-pwd" id="text-pwd"  placeholder="Password" value="" />

       <button type="submit" data-theme="none" name="submit" value=""></button>

     </div>

    </div>

</form>

I don't need submit but since i have to submit form using iPhone soft keyboard any help is very much appreciated. Thanks.

Upvotes: 2

Views: 4246

Answers (2)

krishwader
krishwader

Reputation: 11371

you need a keypress event my friend. The "Go" button on your phone is equivalent to the Enter key of your physical keyboard. You have to check for that keyCode. Here's a code :

$("#my-controlgroup").on("keypress", "input[type=text]", function(e) {
    //check for enter key 
    if(e.which === 13) {
        //check for empty input
        if($("input:empty").length === 0) {
           alert("submitted!");
        }
    }
});

Upvotes: 8

MAST3RMIND
MAST3RMIND

Reputation: 592

Here's the Fiddle, if it helps !

<form id="loginForm" data-ajax="false">

   <div class="ui-body">

     <div data-role="controlgroup" id="my-controlgroup">

       <input data-theme="b" type="text" name="text-username" id="text-username"  placeholder="Username" value="" />

       <input data-theme="b" type="password" name="text-pwd" id="text-pwd"  placeholder="Password" value="" />

       <button type="submit" data-theme="none" name="submit" value="">GO</button>

     </div>

    </div>

</form>

Upvotes: 0

Related Questions