Software Archive
Read-only legacy content
17060 Discussions

jquery mobile intel xdk app form submission not working

shev_r_
Beginner
576 Views

I am creating a jquery mobile app which has a form in it that post data into an online server. when the form has an action attribute in it the form submits correctly and displays a message on the submission page. although i have jquery attached to it to prevent it from navigating to the submission page as shown below.

<form data-ajax="false" id="codeVerification" method="post"  action="http://domain.com/app.php">

            <div data-role="fieldcontain">            
            <label >Code</label>
            <input  type="text" placeholder="enter code" name="code" id="code"/>
            </div>
            <div data-role="fieldcontain">
            <button id="codeSubmit" >Submit</button>
            <input type="hidden" value="codeVerification" name="action"/>
            </div>     
       </form>

and here is my test jquery code to prevent if from navigating to the submission page

 $(document).on("pagecreate",function(){

     $("#codeVerification").on('submit', function(){

   alert('true');

     return false;

});

});

i understand that "data-ajax="false" prevents the form from submiting via ajax so again i have tried removing the action attribute from the form but still not working. when doing this on a browser the jquery code works but not in intel xdk

when i remove the action attribute in the form i get the following error

Cannot POST /http-services/emulator-webserver/ripple/userapp/x/C/Users/user/AppData/Local/XDK/xdk-scratchdir/094cbfa6-5ac4-499c-ab8a-7f4d742e35cd/platforms/android/assets/verify.html

 

What may I be doing wrong? PLEASE HELP

0 Kudos
2 Replies
Chris_P_Intel
Employee
576 Views

This is only a guess, but with forms you have to be very careful about using elements within the form that might conflict with form properties.

For example, I see this in your form:

<input type="hidden" value="codeVerification" name="action"/>

 

name="action" may conflict with the action=""  attribute on the form itself.  

 

 

0 Kudos
Amrita_C_Intel
Employee
576 Views

Hello Shev,

Please refer this sample which comes with XDK : https://github.com/gomobile/sample-jqm-list-view

And this article shows the details of the above sample : https://software.intel.com/en-us/xdk/article/jquery-mobile-listview

0 Kudos
Reply