AngularJs post request getting error

Question

I am trying to do a POST request to a login api through angular js .

<form method="post" ng-submit="doLogin()">
      <div class="list">
        <label class="item item-input">
          <span class="input-label">Username</span>
          <input type="text" ng-model="loginData.user_mail">
        </label>
        <label class="item item-input">
          <span class="input-label">Password</span>
          <input type="password" ng-model="loginData.password">
        </label>
        <label class="item">
          <button class="button button-block button-positive" type="submit" >{{loginTxt}}</button>
        </label>
      </div>
      </form>

Controller.js

$scope.doLogin=function(){
     $http({
          method  : 'POST',
          url     : 'http://examplemns.com/customer/api/v1/login/login',
          data    : $scope.loginData, //forms user object
          timeout:20000
         })
         .success(function(response){
             
              alert(JSON.stringify(response));
           })
           .error(function(err){
                console.log(JSON.stringify(err));
                alert("Network error");
                
             });
         }

But i will get invalid username response even if the username and password is correct. I checked the api through postman plugin its working fine,but when comes with angular i will get invalid.

Here is the sample input

user_mail:[email protected]
password:123456

When try this input with postman plugin i will get the correct response

{
  "status": 1,
  "message": "Done",
  "data": {
    "name": "A.V.M TOURIST HOME",
    "username": "[email protected]",
    "id": "37",
    "key": "cos4ok88woo0kcw40cog0s4gg4skogscso8848ok"
  }
}

but when trying through the angularjs post i with the same input i will get this response

{"status":0,"message":"Invalid username"}

Please help me:(

UPDATE

I need to transform my data to application/x-www-form-urlencoded rather than json (from comments) for that i am used this way.

var data= {user_mail:$scope.loginData.user_mail,password:$scope.loginData.password};
$http({
              method  : 'POST',
              url     : 'http://examplemns.com/customer/api/v1/login/login',
              data    : data, 
              timeout:20000
             })
             .success(function(response){
                 
                  alert(JSON.stringify(response));
               })
               .error(function(err){
                    console.log(JSON.stringify(err));
                    alert("Network error");
                    
                 });

But again i will get the same

Screenshot of request and response from the postman

can you show us either a screenshot or the textual version of your postman request ? — sam
you can get the textual version by clicking on 'generate' at the top right of postman window — sam
The response from the postman is already included in my question — Blessan Kurien

Wasiq Muhammad Wasiq Muhammad · Accepted Answer · 2016-05-18T15:41:09

Try this

    $scope.loginData = {};
    $scope.doLogin=function(){

         $http({
              method  : 'POST',
              url     : 'http://examplemns.com/customer/api/v1/login/login',
              data    : $scope.loginData, //forms user object ,
              headers: {'Content-Type': 'application/x-www-form-urlencoded'}

             })
             .success(function(response){
                  console.log(response);
             })
             .error(function(err){
                    console.log(err);
              });
            }

OR

$scope.loginData = {};
var data = $scope.loginData;
$http.post('/examplemns.com/customer/api/v1/login/login', data).then(successCallback, errorCallback);

ALSO TRY THIS

  <input type="text" ng-model="user_mail">
  <input type="password" ng-model="password">

  var data = {};
  data.user_mail = $scope.user_mail;
  data.password = $scope.password;

  $http.post('/examplemns.com/customer/api/v1/login/login',   data).then(successCallback, errorCallback);

AngularJs post request getting error

2 Answers