AngularJs Http Post not Posting

Question

On button press, no action happens on the browser and there is no new user at my REST endpoint. registerUser() is triggered by button press. I closely followed a tutorial.

The html partial

<div class="section no-pad-bot" ng-controller="registerController" id="index-banner">

blah blah blah then

                <form>
                    <div class="row">
                        <div class=" input-field col s6 offset-s3">
                            <i class="material-icons prefix">account_circle</i>
                            <input type="text" class="validate" ng-model="user.username" placeholder="Username">
                        </div>
                    </div>
                    <div class="row">
                        <div class=" input-field col s6 offset-s3">
                            <i class="material-icons prefix">account_circle</i>
                            <input type="text" class="validate" ng-model="user.email" placeholder="Email">
                        </div>
                    </div>
                    <div class="row">
                        <div class=" input-field col s6 offset-s3">
                            <i class="material-icons prefix">account_lock</i>
                            <input type="text" class="validate" ng-model="user.password" placeholder="Password">
                        </div>
                    </div>
                    <button class="btn waves-effect waves-light" type="submit" ng-click="registerUser()">Submit
                                    <i class="material-icons right">send</i>
                                </button>
                </form>

In the clientapp.js

myApp.controller('registerController', function ($scope, $http) {
    $scope.registerUser = function () {
           // use $.param jQuery function to serialize data from JSON
            var data = $.param({
                hashword: $scope.password,
                username: $scope.username,
                email: $scope.email,
            });

            var config = {
                headers : {
                    'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8;'
                }
            }

            $http.post('/api/users', data, config)
            .success(function (data, status, headers, config) {
                console.log("successful post");
                $scope.PostDataResponse = data;
            })
            .error(function (data, status, header, config) {
                console.log("failed post");
                $scope.ResponseDetails = "Data: " + data +
                    "<hr />status: " + status +
                    "<hr />headers: " + header +
                    "<hr />config: " + config;
            });
        };

I don't see user object in your scope, change ng-model="user.email" to ng-model="email" similarly ng-model="user.username" to ng-model="username" and ng-model="user.password" to ng-model="password" — manish
– manish, Commented Mar 30, 2016 at 10:07

Mukesh Sharma · Accepted Answer · 2016-03-30 10:09:08Z

2

Because in html page, you are referring user.username, 'user.email' and user.password instead of username, email and password respectivbely.

Try to change to following

<input type="text" class="validate" ng-model="username" placeholder="Username">
<input type="text" class="validate" ng-model="email" placeholder="Email">
<input type="text" class="validate" ng-model="password" placeholder="Password">

Hope it helps

answered Mar 30, 2016 at 10:09

Mukesh Sharma

9,0428 gold badges40 silver badges56 bronze badges

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

2 Comments

Natu Myers Over a year ago

Thanks, but still for some reason, the mouse click of the button does nothing

Mukesh Sharma Over a year ago

Sorry, does nothing means ? Try to see payload in Developer Console of browser.

Collectives™ on Stack Overflow

AngularJs Http Post not Posting

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related