简体   繁体   中英

AngularJS Http Post to API

When Add new User is clicked there will be a modal pop-up with form that include a text field and a checkbox.

When I click the create button it does not post the data to the API and also the modal pop-up remain there without closing.

I want the data to be posted to the API (insert), the modal pop-up to close after clicking on create and also the new user to be added to the List.

Please here is my code

$scope.createUser = function(){
        $http({
          method  : 'POST',
          url     : 'mydomain.com/api/CreateUser',
          data    : $scope.newUser,
          headers : {'Content-Type': 'application/x-www-form-urlencoded'} 
         })
          .success(function() {});
  };


<div class="modal-body">

                  <form ng-submit="createUser ()">
                        <div class="form-group">
                            <div class="row" style="padding-left: 30px;">
                              <div class="col-xs-2">
                                <label>User Name</label>
                              </div>
                              <div class="col-xs-10">
                                <input type="text" class="form-control" placeholder="" ng-model="newUser.name">
                              </div>
                            </div>

                        </div>
                        <div class="form-group">
                            <div class="row" style="padding-left: 30px;">
                              <div class="col-xs-2">
                                <label>&nbsp;</label>
                              </div>
                              <div class="col-xs-10">
                                <input type="checkbox" name="active" ng-model="newUser.active"> &nbsp; Is active?
                              </div>
                            </div>

                        </div>


                        <div class="modal-footer">
                            <button class="btn btn-info" type="submit">Create</button>
                            <button class="btn btn-warning" type="button" ng-click="cancel()">Cancel</button>
                        </div>
                </form>
        </div>

Try this:

$http.post('mydomain.com/api/CreateUser', $scope.newUser).success(function(response) {
     console.log(response);
});

or

$http({
    method: 'POST',
    url: 'mydomain.com/api/CreateUser',
    headers: 
    {
        'Content-type': 'application/x-www-form-urlencoded',
    },
    data: 
        'name=' + $scope.newUser.name + 
        '&active=' + $scope.newUser.active
}).success(function(data, status) {
         console.log(data);
});

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM