Convert object to json in angular

Question

I am trying to convert object as json In my updateDetails method But am getting undefined in console.log after converting as json.
Whats wrong here?my cod is..

HTML:

<body ng-app="myApp" ng-controller="myCtrl" ng-init="init()">

                <form id="show_details" ng-repeat="data in editProjDetails">
                    <div>
                        <label><input type="text" class="form-control projectName required onlyAlphaNumeric" ng-model="data.ProjectName" ng-disabled="all"></label>
                    </div>
                    <div>
                        <label><input type="text" class="form-control client required onlyAlphabets" ng-model="data.Client" ng-disabled="all"></label>
                    </div>
                    <div id="projectCoOrdBlock">
                        <label><input type="text" class="form-control projectCoOrd  onlyAlphabets" ng-model="data.ProjectCoordinator" ng-disabled="true"></label>
                    </div>
                    <div>
                        <label><input type="text" class="form-control required onsiteCoOrd onlyAlphabets" ng-model="data.OnsiteCoordinator" ng-disabled="all"></label>
                    </div>
                    <div id="resourceBlock">
                        <label><input type="text"  class="form-control resource  onlyNumeric" ng-model="data.ResourceAllocated" ng-disabled="true"></label>
                    </div>
                    <div>
                        <span class="pull-right btnMarginTop">
                            <button class="btn btn-primary" id="projectDetailsEdit" ng-if="!editMode" ng-click="editDetails()">Edit</button>
                            <button class="btn btn-primary" id="projectDetailsUpdate" ng-if="editMode" ng-click="updateDetails(data)">Update</button>
                        </span>
                    </div>
                </form>
</body>

SCRIPT

var app = angular
                    .module("myApp", [])
                    .controller("myCtrl", function ($scope, $http) {
                        $scope.editMode = false;
                        $scope.all = true;
                        $scope.init = function () {
                            $scope.getId();
                        }
                        $scope.getId = function () {
                            var url = document.URL;
                            var id = /id=([^&]+)/.exec(url)[1];
                            var result = id ? id : ' ';
                            $scope.getProjectDetails(result);   
                        }

                        $scope.goEvent = function () {
                            $scope.editMode = !$scope.editMode;
                        } 
                        $scope.updateDetails = function (data) {
                           debugger
                            $scope.editedArrayDetails = [];
                            $scope.editedArrayDetails.push(data);
                            $scope.json = angular.toJson($scope.data);
                            console.log($scope.data)
                            $scope.goEvent();
                        }
                    })

This is my json fromat:

I want to save my data with these names

if ($scope.json) {
                                $scope.json = { "project_id": Id, "name": ProjectName, "client": Client, "onsite_coordinator": OnsiteCoordinator };
                            }

But am getting Id,ProjectName,Client,OnsiteCoordinator is undefined.

please refer below link stackoverflow.com/questions/11819301/… — Umang Patoliya
– Umang Patoliya, Commented Jun 12, 2017 at 5:07
Yes I did the same thing here $scope.json = angular.toJson($scope.data); .why am getting undefined? — user7397787
– user7397787, Commented Jun 12, 2017 at 5:09

Ram_T · Accepted Answer · 2017-06-12 05:25:43Z

6

You are passing the data as a parameter, hence you should not use $scope prefix. Instead just use data.

  $scope.updateDetails = function (data) {
                        $scope.editedArrayDetails = [];
                        $scope.editedArrayDetails.push(data);
                        $scope.json = angular.toJson(data);
                        console.log($scope.json )
                        $scope.goEvent();
                    }

edited Jun 12, 2017 at 5:25

Ram_T

8,50411 gold badges42 silver badges64 bronze badges

answered Jun 12, 2017 at 5:20

Alexis

8422 gold badges11 silver badges29 bronze badges

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

3 Comments

Alexis Over a year ago

Can you please try it using ng-show / ng-hide instead of ng-if.

user7397787 Over a year ago

But that is not my problem..I am struggled at $scope.json = { "project_id": Id, "name": ProjectName, "client": Client, "onsite_coordinator": OnsiteCoordinator }; here only

Alexis Over a year ago

Sorry, I mean, while you using ng-if, the other ng- components will be executed only if the ng-if condition is true, else it will be skipped at initial compiling.

Sajeetharan · Accepted Answer · 2017-06-12 05:12:44Z

2

You need to print $scope.json not $scope.data, also it should not be $scope.data when you convert, it should be data

 $scope.json = angular.toJson(data);
 console.log($scope.json)

answered Jun 12, 2017 at 5:12

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

1 Comment

user7397787 Over a year ago

Sure Sajeetharan

solanki... · Accepted Answer · 2017-12-15 12:25:44Z

0

For beautification output, pass second parameter as true for angular.toJson(obj, true). The JSON output will contain newlines and whitespace.

answered Dec 15, 2017 at 12:25

solanki...

5,1182 gold badges29 silver badges29 bronze badges

Collectives™ on Stack Overflow

Convert object to json in angular

3 Answers 3

3 Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related