Cannot read property 'push' of undefined Angular JS

Question

I want to change div automatic with $scope.push

but it still have problem with:

Cannot read property 'push' of undefined

My JSON and JAVASCRIPT codes:

JSON

{"records":[{"total":"156000"}]}

JAVASCRIPT

 $scope.plusCart = function() {
        $http({
            method  : 'POST',
            url     : 'http://localhost/so-ku/www/server/menu/plus_cart',
            headers : { 'Content-Type' : 'application/json' },
            data    : JSON.stringify({ rowid: $scope.currentItem.rowid, qty : $scope.currentItem.qty })
        }).success(function(data) {
            total_cart()
        });

    }
    function total_cart() {
    $http.get('http://localhost/so-ku/www/server/menu/total_cart').
        then(function(response){
            $scope.x = [];
            $scope.x = response.data.records;
            $scope.xtotal.push($scope.x.total);
    });
}

html

<div ng-controller="CartCtrl">
    <div ng-repeat="tot in xtotal" style="padding-top: 10px;">
        Rp {{tot.total}}
    </div>
</div>

Note : I want to after submit plusCart , div automatically change the value with $scope.push

Thanks.

push works on array and $ scope is not a array. try on the veriable you defining and assigning value on it — Aniruddha Das, Dec 06 '16 at 00:58
Read [How to Debug Small Programs](http://ericlippert.com/2014/03/05/how-to-debug-small-programs/) — georgeawg, Dec 06 '16 at 08:57

score 1 · Answer 1 · answered Dec 06 '16 at 01:37

as $scope.xtotal is not defined, a array push is showing error there

try below

function total_cart() {
    $http.get('http://localhost/so-ku/www/server/menu/total_cart').
        then(function(response){
            $scope.xtotal = [];   ///define the veriable
            $scope.x = [];
            $scope.x = response.data.records;
            $scope.xtotal.push($scope.x.total);
    });
    }

score 1 · Accepted Answer · answered Dec 06 '16 at 08:02

1

As per your JSON :

{"records":[{"total":"156000"}]}

response.data.records already having an array [{"total":"156000"}].So, there is no need to assign it again in an array.

code correction :

Use only $scope.x = response.data.records instead of $scope.x = []
Declare an array with name $scope.xtotal.

Working Demo :

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

myApp.controller('MyCtrl',function($scope) {
  var jsonObj = {
  "records":[{"total":"156000"}]
  };
              
  $scope.xtotal = [];              
  $scope.x = jsonObj.records;
  $scope.xtotal.push($scope.x[0].total);
  console.log($scope.xtotal);
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MyCtrl">
  <div ng-repeat="item in xtotal">
   {{item}}
  </div>
</div>

answered Dec 06 '16 at 08:02

Debug Diva

26,058
13
70
123

$scope.xtotal is not automatic refresh after submit bro – Azizal Yunan P Dec 06 '16 at 08:28
@AzizalYunanP I did not understand what you want to say – Debug Diva Dec 06 '16 at 08:33
i want to when i submit form then div refresh automatically change the value – Azizal Yunan P Dec 06 '16 at 08:35
@AzizalYunanP It will work with submit also. I just used mock json only for resolving the issue. – Debug Diva Dec 06 '16 at 08:39
yeah done bro , i want ask a question once more , how push data with another page example : header content button is in content area , but i want push data from header ?? – Azizal Yunan P Dec 06 '16 at 10:00
@AzizalYunanP you have to use `$scope.broadcast` to pass the data from the parent to child controller.It will fulfill your requirement. – Debug Diva Dec 06 '16 at 12:32

Akbar Kautsar · Answer 3 · 2016-12-06T03:42:59.620

0

$scope.x Is an array. because {"records":[{"total":"156000"}]}

If you want to assign all values from resonse.data.records you can simply do:

$scope.xtotal = response.data.records;

If you want to do manually, and yes you need to declare variable as an array:

$scope.xtotal = [];
for (var i = 0; i < $scope.x.length; i++) {
    var obj = $scope.x[i];
    // do your modification for an obj
    // and push to your $scope.xtotal
    $scope.xtotal.push(obj);
}

edited Dec 06 '16 at 03:42

answered Dec 06 '16 at 03:37

Akbar Kautsar

416
5
13

yes i know ,but when i submit post data ,
is not automatic refresh bro
– Azizal Yunan P Dec 06 '16 at 03:53
I see, so after submitting the form, you are expecting total is updated in frontend? May be there are an error when submiting the form data. maybe you can add .error in your post method `$http({}).success(function(){}).error(function(){});` And try to log something in error section Also just my suggestion please use **.then** rather than **.success** Please refer [here](http://www.dwmkerr.com/promises-in-angularjs-the-definitive-guide/#promisessuccesserrorthen) and [here](http://stackoverflow.com/questions/38627623/angularjs-http-success-vs-then) – Akbar Kautsar Dec 06 '16 at 05:35

score 0 · Answer 4 · answered Dec 06 '16 at 04:19

0

Because $scope.x (which is set to response.data.records) is already the array you want

$scope.xtotal.push($scope.x.total);

should just be

$scope.xtotal = $scope.x;

See plunker: http://plnkr.co/edit/fo1kffVaIUKe3DrRDODN?p=preview

answered Dec 06 '16 at 04:19

K Scandrett

16,390
4
40
65

Cannot read property 'push' of undefined Angular JS

4 Answers4