Form POST the traditional way using $http

Using Content type application/x-www-form-urlencoded and encoding the parameters that are passed in the body.

by cmyworld

HTML

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.js"></script>
<body ng-app="">
    <div ng-controller="UserController">
        <form name="form" class="css-form" novalidate>Name:
            <input type="text" ng-model="user.name" name="uName" required />
            <br />E-mail:
            <input type="email" ng-model="user.email" name="uEmail" required/>
            <br />Gender:
            <input type="radio" ng-model="user.gender" value="male" />male
            <input type="radio" ng-model="user.gender" value="female" />female
            <br />
            <button ng-click="update(user)">SAVE</button>
            <br/>User Data: {{user}}</form>
            <br/> See browser network log for the requests made.
    </div>
</body>

JavaScript

function UserController($scope,$http) {
    $scope.update = function (user) {
        $http({
            method: 'POST',
            url: 'https://mytestserver.com/that/does/not/exists',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
            },
            transformRequest: function (data) {
                var postData = [];
                for (var prop in data)
                postData.push(encodeURIComponent(prop) + "=" + encodeURIComponent(data[prop]));
                return postData.join("&");
            },
            data: user
        });
    }
}