jQuery mobile ajax login form authentication

Posted by Jakub Zak on Stack Overflow See other posts from Stack Overflow or by Jakub Zak
Published on 2012-12-17T13:07:50Z Indexed on 2012/12/17 17:03 UTC
Read the original article Hit count: 201

Filed under:
|
|
|
|

I know i already asked simillar question, but now when I work with jQuery Mobile I can't figure it out. So I have this form:

<div data-role="page" data-theme="a" id="login_page">
        <div data-role="header" data-position="fixed">
            <h1>****</h1>
        </div>
        <div data-role="content">
            <form id="login_form" method="POST" data-ajax="false">
            <label for="basic">Username:</label>
            <input type="text" name="name" id="username" value=""/>
            <label for="basic">Password:</label>
            <input type="password" name="password" id="password" value=""/>
            <input type="submit" value="Login" id="login" name="login"/>
            </form>
        </div>
        <div data-role="footer" data-position="fixed">
            <div data-role="navbar"></div>
        </div>
</div>

And I need to submit Username and Password to php script, where php replies and send "success" or "failed". Here is php:

<?php
session_start();

$username = $_POST["name"];
$password = $_POST["password"];

include('mysql_connection.php');
mysql_select_db("jzperson_imesUsers", $con);

$res1 = mysql_query("SELECT * FROM temp_login WHERE username='$username' AND password='$password'");
$count=mysql_num_rows($res1);

if($count==1){
    echo "success";
}else{
    echo "failed";
}
?>

And to do all this I want to use this script:

$(document).ready(function() {
        $("form").submit(function(){
            $.mobile.showPageLoadingMsg();

            $.ajax({
                url: "http://imes.jzpersonal.com/login_control.php",
                type: "POST",
                dataType: "jsonp",
                jsonp: "jsoncallback",
                data: $("form#login_form").serialize(),
                success: function( response ){
                    $.mobile.changePage( "http://imes.jzpersonal.com/user_panel.html");
                }
            });
            return false;
        });
    });

But I can't make it work, I know I must have mistakes in there, I just can't find them, or better way to do it. Thank you in advance for any help.

© Stack Overflow or respective owner

Related posts about php

Related posts about AJAX