What is wrong with my jQuery Ajax?

Question

I have this HTML

<section id="login">
    <form>
        <input type="text" name="username" size="10" placeholder="username" />
        <input type="password" name="password" size="10" placeholder="password" />
        <input type="submit" name="login" value="Login" />
    </form>
</section>

With this $.ajax() that calls the PHP (sys_login.php).

$(function(login){
$('#login form').submit(function(e){

    var uname   =   $('input[name="username"]').val();
    var pwd     =   $('input[name="password"]').val();

    var dataObject = {
            command     : "login",
            username    : uname,
            password    : pwd
        };

    $.ajax({
        type     : "POST",
        url      : "application/sys/sys_login.php",
        data     : dataObject,
        dataType : "json",
        success: function(response, status){
            if (response.status===true){
                docCookies.setItem("sessionid", response.sessionid);
                docCookies.setItem("username", response.username);
                docCookies.setItem("roles", response.roles);
                location.href = "application/index.php";

            }else{
                console.log("false")
                }           
            },
        beforeSend:function(){
            console.log("sending")
        }
    }).error(function() {
        console.log("error");
    });
    e.preventDefault();
});
});

But it never got to the sys_login.php file. If I use GET, it will reach the php file. During debug, even the console didn't print anything. What did I do wrong?

**UPDATE Apparently the backend server malfunctioned. The script works on other machines. Thank you for you time guys.

try using `$(function(){` instead of `$(function(login){` – C M Nov 13 '13 at 06:28 — C M, Nov 13 '13 at 06:28
are you using simple php or any other framework – rajesh kakawat Nov 13 '13 at 06:52 — rajesh kakawat, Nov 13 '13 at 06:52

score 2 · Answer 1 · edited May 23 '17 at 12:28

2

You should stringify(dataObject) before sending it to PHP.

Try with

    $.ajax({
        type     : "POST",
        url      : "application/sys/sys_login.php",
        data     : JSON.stringify(dataObject),
        dataType : "json",
)};

see here

edited May 23 '17 at 12:28

Community

1
1

answered Nov 13 '13 at 06:27

yashhy

2,856
5
31
57

score 0 · Answer 2 · answered Nov 13 '13 at 06:31

Can you try this, Make sure you have unique element Id in your html,

<section >
    <form id="login">
        <input type="text" name="username" size="10" placeholder="username" />
        <input type="password" name="password" size="10" placeholder="password" />
        <input type="submit" name="login" value="Login" />
    </form>
</section>

 <script type="text/javascript">
 $(function(){
        $('#login').submit(function(e){

            var uname   =   $('input[name="username"]').val();
            var pwd     =   $('input[name="password"]').val();

            var dataObject = {
                    command     : "login",
                    username    : uname,
                    password    : pwd
                };

            $.ajax({
                type     : "POST",
                url      : "application/sys/sys_login.php",
                data     : dataObject,
                dataType : "json",
                success: function(response, status){
                    if (response.status===true){
                        docCookies.setItem("sessionid", response.sessionid);
                        docCookies.setItem("username", response.username);
                        docCookies.setItem("roles", response.roles);
                        location.href = "application/index.php";

                    }else{
                        console.log("false");
                        }           
                    },
                beforeSend:function(){
                    console.log("sending");
                }
            }).error(function() {
                console.log("error");
            });
            e.preventDefault();
        });
    });

ref:- http://api.jquery.com/submit/

score 0 · Answer 3 · answered Nov 13 '13 at 10:55

Try this code:

 $(function(login){
    $('#login form').submit(function(e){

        var uname   =   $('input[name="username"]').val();
        var pwd     =   $('input[name="password"]').val();

        var dataObject = '{
                "command"     : "login",
                "username"    : "'+uname+'",
                "password"    : "'+pwd+'"
            }';

        $.ajax({
            type     : "POST",
            url      : "application/sys/sys_login.php",
            data     : dataObject,
            dataType : "json",
            success: function(response){
                if (response.status===true){
                    docCookies.setItem("sessionid", response.sessionid);
                    docCookies.setItem("username", response.username);
                    docCookies.setItem("roles", response.roles);
                    location.href = "application/index.php";

                }else{
                    console.log("false")
                    }           
                },
            beforeSend:function(){
                console.log("sending")
            }
        }).error(function() {
            console.log("error");
        });
        e.preventDefault();
    });
    });

What is wrong with my jQuery Ajax?

3 Answers3