AngularJs Http put services

The $http.put() services are used to puts a file and resource at a specific URI and exactly at that URI that means we can say that  PUT is used to update the existing data's to the given URL.
The examples as,
//The AngularJs code-sample
 var app = angular.module('myServiceApp', []);
 app.controller('myServiceCtrl', function ($scope) {
  $scope.name = "Anil "; //default
  $scope.age = 30; //default
  $scope.adress = "Noida, India"; //default
  $scope.lblMsg = null; //default

  $scope.putdata = function (name, age, adress) {
        var data = {
                    name: name,
                    age: age,
                    adress: adress
          };

         //Call the put services
          $http.put('htpp://localhost:8080/api/users/put', JSON.stringify(data)).then(function (rest, status) {
                    if (status) {
                        if (rest.data)
                            $scope.lblMsg = "Update data submit successfully!";
                    } else {
                        $scope.lblMsg = "faild to update!";
             }
         });
      };

});

//The HTML code-sample
<div ng-app="myServiceApp">
    <div ng-controller="myServiceCtrl">
        <div>
            Name :
            <input ng-model="name" />
            <br> Age :
            <input ng-model="age" />
            <br> Adress :
            <input ng-model="adress" />
            <br>
            <a href="#" ng-click="putdata(name, age, adress)">Update</a>
            <br> Output Message : {{ $scope.lblMsg}}
        </div>
    </div>
</div>

//The Full Live demo code-sample(HTML + Angular)
<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>Processing $http.put() response in service</title>
    <script src="https://code.angularjs.org/1.3.0-beta.5/angular.js"></script>
    <script>
        var app = angular.module('myServiceApp', []);

        app.controller('myServiceCtrl', function ($scope) {
            $scope.name = "Anil "; //default
            $scope.age = 30; //default
            $scope.adress = "Noida, India"; //default

            $scope.lblMsg = null; //default

            $scope.putdata = function (name, age, adress) {

                var data = {
                    name: name,
                    age: age,
                    adress: adress
                };

                alert(JSON.stringify(data));

                //Call the put services
                $http.put('htpp://localhost:8080/api/users/put', JSON.stringify(data)).then(function (rest, status) {
                    if (status) {
                        if (rest.data)
                            $scope.lblMsg = "Update data submit successfully!";
                    } else {
                        $scope.lblMsg = "faild to update!";
                    }
                });
            };

        });
    </script>
</head>
<body ng-app="myServiceApp">
    <div ng-controller="myServiceCtrl">
        <div>
            Name :
            <input ng-model="name" />
            <br> Age :
            <input ng-model="age" />
            <br> Adress :
            <input ng-model="adress" />
            <br>
            <a href="#" ng-click="putdata(name, age, adress)">Update</a>
            <br> Output Message : {{ $scope.lblMsg}}
        </div>
    </div>
</body>
</html>
The live output,

About Blogger

ANIL SINGH

Hey! I am Anil Singh. I am Active Blogger, Writer and Programmer. I love learning new technologies, programming, blogging and participating the forum discussions more...
http://www.code-sample.com
http://www.code-sample.xyz

    Blogger Comment
    Facebook Comment

0 comments:

Post a Comment

SQL Server NodeJs TypeScript JavaScript Angular SQL Server My Book