I'm trying to build a simple login system for my PhoneGap app. I have a form where user gives a username and if there is a matching username in the MYSQL the user is redirected to another page. Else an alert is shown. The code works just fine on firefox and chrome, but when I try to use it on Safari or on the PhoneGap app it doesn't seem to work. What could be the reason?

HTML

    <form id="login-form" rel="external" data-ajax="false" >

    <label for="number">Number:</label> 
    <br>
    <input type='tel' name="number" id="number" data-corners="false" data-theme="d"/>
    <br>

    <label for="username">Username:</label>
    <br>

    <input name="username" id="username" data-corners="false" data-theme="d"/>
    <br>

<input type="submit" value="OK" data-theme="b" data-corners="false" />
</form>

JS

 $(function() {    
     $('#login-form').submit(function(event) {
         event.preventDefault();

         $.post(serviceURL +'login.php', { 
             kayttaja: $('[name="username"]').val(), 
         }).success(function(data) { 
             if (data.status == 'ok') {
                 var input = document.getElementById("number");
                 var user = document.getElementById("username");
                localStorage.setItem("number", input.value);
                localStorage.setItem("username", user.value);
                 window.location.pathname = data.redirect;
             } else {
                 alert(data.message);
             }
         })
     })
}) 

I'm trying to build a simple login system for my PhoneGap app. I have a form where user gives a username and if there is a matching username in the MYSQL the user is redirected to another page. Else an alert is shown. The code works just fine on firefox and chrome, but when I try to use it on Safari or on the PhoneGap app it doesn't seem to work. What could be the reason?

HTML

    <form id="login-form" rel="external" data-ajax="false" >

    <label for="number">Number:</label> 
    <br>
    <input type='tel' name="number" id="number" data-corners="false" data-theme="d"/>
    <br>

    <label for="username">Username:</label>
    <br>

    <input name="username" id="username" data-corners="false" data-theme="d"/>
    <br>

<input type="submit" value="OK" data-theme="b" data-corners="false" />
</form>

JS

 $(function() {    
     $('#login-form').submit(function(event) {
         event.preventDefault();

         $.post(serviceURL +'login.php', { 
             kayttaja: $('[name="username"]').val(), 
         }).success(function(data) { 
             if (data.status == 'ok') {
                 var input = document.getElementById("number");
                 var user = document.getElementById("username");
                localStorage.setItem("number", input.value);
                localStorage.setItem("username", user.value);
                 window.location.pathname = data.redirect;
             } else {
                 alert(data.message);
             }
         })
     })
}) 

• javascript
• jquery
• cordova
• authentication

Share Improve this question Follow asked Jun 6, 2012 at 9:50 user1323294user1323294 63255 gold badges1515 silver badges2323 bronze badges 2

• which version of phonegap are you using?? If its cordova then check whether you have included the server in <access origin=''> list – dhaval Commented Jun 6, 2012 at 10:56
• I'm using cordova, and i have set <access origin=".*"/> – user1323294 Commented Jun 6, 2012 at 11:08

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 2

you can follow these steps for creating simple login system using phonegap / apache cordova

• Create JSON based Web Service for Authentication Purpose
• Use JQuery / Angular JS for Connect with Web Service using Ajax method
• If authentication success, redirect page using javascript window.location.href="home.html"
• use localStorage for Storing auth values

I got this information from https://codesundar./phonegap-login-system-using-php-mysql/