Ajax not working for login check

Question

Hello I am not good with ajax.I want to check my login info and return either 'success' or 'fail'.Buy my ajax seems to have an error.

var user = $('.username').value();
var pass = $('.password').value();

$.ajax({
  type : 'POST',
  url  : 'login_check.php',
  data : {
    'username': user,
    'password': pass
  },
  beforeSend: function() {
    $("#Loading").show();
  },
  success :  function(response) {     
    if(response=="success" && response!=="fail") {
      $('.status').html("Success! Now logging in ......");
      setTimeout(' window.location.href = "index.php"; ',4000);
    } else {
      $('#Loading i').hide();
      $('.status').html("Login fail! Please use correct credentials....");
      setTimeout(' window.location.href = "login.php"; ',4000);
    }
  }
});

Can anyone points me out?

what error you get ? also you dont need if(response=="success" && response!=="fail") remove it — Abslen Char, Mar 17 '18 at 18:24
Get the error using this and see what it says https://stackoverflow.com/questions/1637019/how-to-get-the-jquery-ajax-error-response-text — Robert, Mar 17 '18 at 18:34

score 4 · Accepted Answer · answered Mar 17 '18 at 18:36

The reason you are getting error is because your javascript is getting break(giving error) at $('.username').value(); as there is no value() function. If you open console you get this error. So because of this rest of script is not working. So change $('.username').value(); to this $('.username').val(); and same for the var pass = $('.password').value(); change to var pass = $('.password').val(); and also you don't need if condition as mention in comment. Your final code will be something like this.

var user = $('.username').val();
var pass = $('.password').val();
$.ajax({
    type: 'POST',
    url: //some url
        data: {
            'username': user,
            'password': pass,
        },
    beforeSend: function() {
        //some code
    },
    success: function(response) {
        // some code which you want to excute on success of api
    },
    error: function(xhr, status, error) {
        // some code which you want to excute on failure of api
    }
});

This is exactly what I am looking for.You save my time.Thanks — Lin Aung, Mar 18 '18 at 02:46

Abslen Char · Answer 2 · 2018-03-17T18:39:37.763

I dont have the whole code for your app but when it come to your ajax request your code should look like this , for a more accurate answer please show the error that you are getting

  var user = $('.username').val();
    var pass = $('.password').val();
    $.ajax({
    type : 'POST',
    url  : 'login_check.php',
    data : {
                'username':user,
                'password':pass,
                },
    beforeSend: function()
    { 
     $("#Loading").show();
    },
    success :  function(response)
       {      

       $('.status').html("Success! Now logging in ......");
       setTimeout(()=>{ window.location.href = "index.php"; },4000);
       },
    error: function(xhr, status, error) {

       $('#Loading i').hide();
       $('.status').html("Login fail! Please use correct credentials....");
       setTimeout(()=>{ window.location.href = "login.php"},4000);

      }
    });

score 0 · Answer 3 · answered Mar 17 '18 at 18:42

0

Your response needs to be a PHP echo that returns a string with a value of either ”success” or ”fail”.

Your PHP response after successful login:

echo(‘success’);

Your PHP response after failed login:

echo(‘fail’);

answered Mar 17 '18 at 18:42

suchislife

4,251
10
47
78

Ajax not working for login check

3 Answers3