angularjs - Checkboxes populated from scope object (http request) dont update json -
i have collection of checkboxes monday sunday , below list of objects loaded dynamically http request. have < pre > item binds object 'shifts' dom , shows me json output. right items loaded http request when clicked not update json, kicker is, once day of week checkbox clicked , item loaded request clicked works expected. have included code viewing pleasure.
html partial
<div class="form-inline text-center"> <div class="form-group"> <div class="checkbox-custom checkbox-primary"> <input type="checkbox" id="sunday" ng-model="shift.days.sunday"> <label for="sunday">sun</label> </div> </div> <div class="form-group"> <div class="checkbox-custom checkbox-primary"> <input type="checkbox" id="monday" ng-model="shift.days.monday"> <label for="monday">mon</label> </div> </div> <div class="form-group"> <div class="checkbox-custom checkbox-primary"> <input type="checkbox" id="tuesday" ng-model="shift.days.tuesday"> <label for="tuesday">tue</label> </div> </div> <div class="form-group"> <div class="checkbox-custom checkbox-primary"> <input type="checkbox" id="wednesday" ng-model="shift.days.wednesday"> <label for="wednesday">wed</label> </div> </div> <div class="form-group"> <div class="checkbox-custom checkbox-primary"> <input type="checkbox" id="thursday" ng-model="shift.days.thursday"> <label for="thursday">thu</label> </div> </div> <div class="form-group"> <div class="checkbox-custom checkbox-primary"> <input type="checkbox" id="friday" ng-model="shift.days.friday"> <label for="friday">fri</label> </div> </div> <div class="form-group"> <div class="checkbox-custom checkbox-primary"> <input type="checkbox" id="saturday" ng-model="shift.days.saturday"> <label for="saturday">sat</label> </div> </div> </div> <br> <div class="text-center strong">for</div> <br> <div class="text-center"> <div class="form-group" ng-repeat="machine in machineobj"> <div class="checkbox-custom checkbox-primary"> <input type="checkbox" ng-model="shift.machines[machine.address]" name="machinegroup" id="{{machine.name}}"> <label for="{{machine.name}}">{{machine.name}}</label> </div> </div> </div> <pre ng-bind="shift | json"></pre> below json object calling http request:
[ { "name": “random 1“, "address": "0013a20040b4ddb4", "progress": 27.424768518519, "active": false, "dates": [ { "date": "november 2014" }, { "date": "december 2014" }, { "date": "january 2015" }, { "date": "february 2015" }, { "date": "march 2015" }, { "date": "april 2015" }, { "date": "may 2015" }, { "date": "june 2015" } ], "hardware": [ { "input": "green light\r" }, { "input": "coolant pump\r" }, { "input": "spindle\r" }, { "input": "pallet rotate\r" } ], "workperiod": "24" }, { "name": “random 2“, "address": "0013a20040b2fcc6", "progress": 100, "active": false, "dates": [ { "date": "november 2014" }, { "date": "december 2014" }, { "date": "january 2015" }, { "date": "february 2015" }, { "date": "march 2015" }, { "date": "april 2015" }, { "date": "may 2015" }, { "date": "june 2015" } ], "hardware": [ { "input": "machine ready\r" }, { "input": "coolant pump\r" }, { "input": "spindle\r" }, { "input": "pallet rotate\r" } ], "workperiod": "24" }, { "name": “random 3“, "address": "0013a20040be217c", "progress": 20.896990740741, "active": false, "dates": [ { "date": "december 2014" }, { "date": "january 2015" }, { "date": "february 2015" }, { "date": "march 2015" }, { "date": "april 2015" }, { "date": "may 2015" }, { "date": "june 2015" } ], "hardware": [ { "input": "machine ready\r" }, { "input": "spindle\r" }, { "input": "spare\r" }, { "input": "spare\r" } ], "workperiod": "24" }, { "name": “random 4“, "address": "0013a20040c164d3", "progress": 100, "active": false, "dates": [ { "date": "january 2015" }, { "date": "february 2015" }, { "date": "march 2015" }, { "date": "april 2015" }, { "date": "may 2015" }, { "date": "june 2015" } ], "hardware": [ { "input": "hydraulic\r" }, { "input": "pallet\r" }, { "input": "spindle\r" }, { "input": "input 4\r" } ], "workperiod": "24" }, { "name": “random 5”, "address": "0013a20040c165bc", "progress": 15.364583333333002, "active": true, "dates": [ { "date": "february 2015" }, { "date": "march 2015" }, { "date": "april 2015" }, { "date": "may 2015" }, { "date": "june 2015" } ], "hardware": [ { "input": "machine ready\r" }, { "input": "door open \r" }, { "input": "spindle\r" }, { "input": "pallet rotate\r" } ], "workperiod": "24" }, { "name": “random 6“, "address": "0013a20040c1665b", "progress": 47.118055555556, "active": false, "dates": [ { "date": "february 2015" }, { "date": "march 2015" }, { "date": "april 2015" }, { "date": "may 2015" }, { "date": "june 2015" } ], "hardware": [ { "input": "machine ready\r" }, { "input": "door open\r" }, { "input": "spindle\r" }, { "input": "input 4\r" } ], "workperiod": "24" }, { "name": “random 7“, "address": "0013a20040c165b4", "progress": 0, "active": false, "dates": [ { "date": "february 2015" }, { "date": "march 2015" }, { "date": "april 2015" }, { "date": "may 2015" }, { "date": "june 2015" } ], "hardware": [ { "input": "control on\r" }, { "input": "part loaded\r" }, { "input": "spare\r" }, { "input": "spare\r" } ], "workperiod": "24" }, { "name": “random 8“, "address": "0013a20040d4b3a8", "progress": 81.116898148148, "active": false, "dates": [ { "date": "april 2015" }, { "date": "may 2015" }, { "date": "june 2015" } ], "hardware": [ { "input": "machine ready\r" }, { "input": "spindle \r" }, { "input": "turret \r" }, { "input": "input 4\r" } ], "workperiod": "24" }, { "name": “random 9“, "address": "0013a20040d4b34a", "progress": 100, "active": false, "dates": [ { "date": "april 2015" }, { "date": "may 2015" }, { "date": "june 2015" } ], "hardware": [ { "input": "machine ready\r" }, { "input": "spindle 1\r" }, { "input": "turret 1\r" }, { "input": "spindle 2\r" }, { "input": "turret 2\r" }, { "input": "spare\r" }, { "input": "spare\r" }, { "input": "spare\r" } ], "workperiod": "24" }, { "name": “random 10”, "address": "0013a20040a5a7b3", "progress": 0, "active": false, "dates": [ { "date": "january 2014" }, { "date": "february 2014" }, { "date": "march 2014" }, { "date": "april 2014" }, { "date": "may 2014" }, { "date": "june 2014" }, { "date": "july 2014" }, { "date": "august 2014" }, { "date": "september 2014" }, { "date": "october 2014" }, { "date": "november 2014" }, { "date": "december 2014" }, { "date": "january 2015" }, { "date": "february 2015" }, { "date": "march 2015" }, { "date": "april 2015" }, { "date": "may 2015" }, { "date": "june 2015" } ], "hardware": [ { "input": "bender\r" }, { "input": "hydraulics\r" }, { "input": "punch\r" }, { "input": "cycle\r" } ], "workperiod": "24" } ] when navigating page days of week checkboxes loaded object json above done asynchronously , shows 5 seconds after page loaded. can not imagine issue. feeling kind of lost , appreciate assistance or guideance can give
update #1
here controller code:
angular.module('shiftprofilecontroller', []). controller('shiftprofilecontroller', function($scope, $rootscope, $http) { $rootscope.sidebar = false; $rootscope.rightsidebar = false; $scope.shift = {}; }); i added $scope.shift = {}; , works. please see related answer below thoughts on why may happen?
well embarrassing. solved issue. turns out needed
$scope.shift = {}; in controller shift.days checkboxes create {} whereas checkboxes objects requested http did not.
Comments
Post a Comment