Handling $http AngularJS return data

Question

Here is client side in AngularJS (works fine):

$scope.ajaxLogin = function(){
    var fn = document.getElementById("username").value;
    var pw = document.getElementById("password").value;
    $http({
        url: "myurl", 
        method: "POST",
        headers: {'Content-Type': 'application/x-www-form-urlencoded'},
        data: { username: fn, password: pw }
    }).success(function(data, status, headers, config) {
        // this callback will be called asynchronously
        // when the response is available
        $scope.showAlertError();
    }).error(function(data, status, headers, config) {
        // called asynchronously if an error occurs
        // or server returns response with an error status.
        $scope.showAlertError();
    });
};

I expect to have success only if user and password are matched. Server side:

if ($result=mysqli_query($con,$sql))
{     
    $rowcount=mysqli_num_rows($result);
    printf($rowcount);
    mysqli_free_result($result);
}

Before AngularJS I used normal AJAX handling. this is how i did earlier:

  function ajax_post(){
      // Create our XMLHttpRequest object
      var hr = new XMLHttpRequest();
      // Create some variables we need to send to our PHP file
      var url = "myurl";
      var fn = document.getElementById("username").value;
      var ln = document.getElementById("password").value;
      var vars = "username="+fn+"&password="+ln;
      hr.open("POST", url, true);
      // Set content type header information for sending url encoded variables in the request
      hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
      // Access the onreadystatechange event for the XMLHttpRequest object
      hr.onreadystatechange = function() {
        if(hr.readyState == 4 && hr.status == 200) {
          var return_data = hr.responseText;

        if(return_data=="1"){

          console.log("this is return data"+return_data);

        }else{

          ons.notification.alert({message: 'Login Failed!'});

        }

        }
      }
      // Send the data to PHP now... and wait for response to update the status div
      hr.send(vars); // Actually execute the request

  }

How can I use this with AngularJS? I tried putting similar code in success handler, but it always goes to else block.

Manube · Accepted Answer · 2015-02-14 10:11:00Z

1

did you try this:

.success(function(data, status, headers, config) {
  if(status === 200) {
    var return_data = data;
    if(return_data==="1"){
      location.href = "home.html?username=" + fn;
    }
    else{
      ons.notification.alert({message: 'Login Failed!'});
    }
  }
}

answered Feb 14, 2015 at 10:11

Manube

5,2294 gold badges38 silver badges61 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Manube Over a year ago

do you mean you are getting: {message: 'Login Failed!'}, which would mean that return_data !=="1"? What is the value of data/return_data?

Manube Over a year ago

please add in the success function: console.log(data, status) and post here

Im Batman Over a year ago

it gives 0, 200 . but the problem is when i used my old method it gives 1. there is no way it gives 0. you can see my php code above. am i sending my data correctly? i think problem is that

Im Batman Over a year ago

it worked. after i Decode the JSON in PHP file. problem was AngularJS sends data like JSON i didnt know about that before. thanks for the help

Alaksandar Jesus Gene · Accepted Answer · 2015-02-14 10:14:17Z

$scope.ajaxLogin = function(){
    var fn = document.getElementById("username").value;
    var pw = document.getElementById("password").value;
     $http({
    url: "myurl", 
    method: "POST",
    headers: {'Content-Type': 'application/x-www-form-urlencoded'},
    data: { username: fn, password: pw }
    }).success(function(data, status, headers, config) {


                                       //Your server output is received here.
      if(data){console.log('username and password matches');}
      else {console.log('username and password does not match');}



 $scope.showAlertError();
    }).
  error(function(data, status, headers, config) {
   // called asynchronously if an error occurs
   // or server returns response with an error status.
   $scope.showAlertError();

    });

  };

Collectives™ on Stack Overflow

Handling $http AngularJS return data

2 Answers 2

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related