$http PUT call angularJS

Question

I am trying to make put call in angular js after selecting value from dropdown selection. I already got value from selection. Just want too make put call but not able to make response.

Here is HTML

<!DOCTYPE html>
<html ng-app="myApp">

    <head>
        <script data-require="[email protected]" data-semver="1.5.6" src="https://code.angularjs.org/1.5.6/angular.js"></script>
        <script data-require="[email protected]" data-semver="1.8.3" src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.8.3/jquery.js"></script>
        <link rel="stylesheet" href="style.css" />
        <script src="script.js"></script>
    </head>

    <body ng-controller="sensorsCtrl">
        <span class="sensors actionable u-mv" id="myid" ng-     click="addSequenceLink()">  
            Add Sequence Link
        </span>
        <div ng-show="innerIsIsLoading" style="position: fixed; z-index: 999999; top: 450px; left: 65%">
            <px-spinner size="50"></px-spinner>
        </div>
        <div>
            <select ng-model="asset1" id="assetNameGroup" ng-change="changedValue(asset1)" ng-options="x.name for x in Nameitems track by x.uri">
                <option>Select Name</option>
            </select>

            <select ng-model="asset2" id="assetNameGroup2" ng-change="sectionChangedValue(asset2)" ng-options="x.name for x in asset1.sections">
                <option value="">Select Name</option>
            </select>
            <select ng-model="asset3" id="assetNameGroup3" ng-change="positionChangedValue(asset3)" ng-options=" x.sensorPositionName for x in asset2.ultrasonicSensorPositions">
                <option value="">Select Name</option>
            </select>

            {{positionItem}}
        </div>
    </body>
</html>

javascript

console.clear();

var app = angular.module("myApp", []);

app.controller('sensorsCtrl', function($scope, $window, $timeout, $http{
    $scope.innerIsIsLoading = true;

    $http.get('sample.json').success(function(resp) {
        $scope.innerIsIsLoading = false;
        $scope.assetData = resp;
        $scope.Nameitems = [];

        var testobj = $scope.assetData[0].name;

        angular.forEach($scope.assetData, function(val, key) {
            $scope.Nameitems.push({
                "name": val.name,
                "uri": val.uri,
                "sections": val.sections
            });
        });
    });

    $scope.itemList= []; 
    $scope.sectionItem = [];
    $scope.positionItem = [];

    $scope.changedValue = function(item){
        $scope.itemList.push(item.sections);
    } 

    $scope.sectionChangedValue = function(item){
        $scope.sectionItem.push(item.ultrasonicSensorPositions)
    }

    $scope.positionChangedValue = function(item){
        $scope.positionItem.push(item)
    }

    $scope.onclick= function(currentUlSensor){
        var req = {
            method: 'PUT',
            url: xyz,
            headers: {
                'Content-Type': 'application/json'
            },
            data: $scope.positionItem;
        }

        $http(req).success(function (response) {
            $scope.isLoading = false;
            $scope.xyz= response;
        });
    }
});

Data should be from last drop down section data make put call and request data is like this

   [
   {
     "ultrasonicSensorPositionId": 18,
     "sensorPositionName": "ultrasonic sensor position 1",
     "diameter": 22.5,
    "rotation": 90,
     "sequenceNumber": 1,
     "sectionId": "/assets/332008d3-fddc-391b-9cc1-6a41f7ff73d1"
  },
  {
    "ultrasonicSensorPositionId": 19,
    "sensorPositionName": "ultrasonic sensor position 2”,
     "diameter": 22.5,
    "rotation": 90,
    "sequenceNumber": 2,
    "sectionId": "/assets/332008d3-fddc-391b-9cc1-6a41f7ff73d1"
  }
  ]

here is plunker demo .

Well, besides having a ; in data: $scope.positionItem;, where onclick is being called? — st2rseeker
– st2rseeker, Commented Jan 2, 2017 at 17:36
yes. it is ready to handle put request but first I want to make request locally either in console I want to print data or in JSON file — aaakanks
– aaakanks, Commented Jan 2, 2017 at 17:37
The {{positionItem}} seems to be fine - except the fact that there is no handling of null values :) (when you select Select Name) — st2rseeker
– st2rseeker, Commented Jan 2, 2017 at 17:38
plnkr.co/edit/uzCJRz0EaWOiahryDuyB?p=preview please check this . — aaakanks
– aaakanks, Commented Jan 2, 2017 at 17:39

st2rseeker · Accepted Answer · 2017-01-02 18:15:48Z

2

Your request seems to be OK - just remove the ; from data: $scope.positionItem;. I usually use:

$http({
    url: xyz,
    method: 'PUT',
    contentType: 'application/json; charset=utf-8',
    data: $scope.positionItem
}).then(function (result) { // this is the success
    ...
}, function (error) {  // this is the error
    ....
});

edited Jan 2, 2017 at 18:15

answered Jan 2, 2017 at 17:59

st2rseeker

4831 gold badge5 silver badges29 bronze badges

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

Collectives™ on Stack Overflow

$http PUT call angularJS

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related