javascript - TypeError: Cannot read property 'getTime' of undefined -
i getting problem when trying use daypilot calendar in angularjs.
https://code.daypilot.org/63034/angularjs-event-calendar-open-source
when downloaded sources , use it not working , throwing error
angular.js:9563 typeerror: cannot read property 'gettime' of undefined @ loadevents (daypilot-all.min.js:11) @ update (daypilot-all.min.js:11) @ object.fn (daypilot-all.min.js:11) @ h.$digest (angular.js:12031) @ h.$apply (angular.js:12279) @ g (angular.js:7991) @ c (angular.js:8196) @ xmlhttprequest.y.onreadystatechange (angular.js:8137)
source code of downloaded code is
<!doctype html> <html> <head> <meta charset="utf-8"> <title>daypilot: angularjs event calendar</title> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script> <script src="js/daypilot/daypilot-all.min.js" type="text/javascript"></script> <!-- helper libraries --> <script src="js/jquery/jquery-1.9.1.min.js" type="text/javascript"></script> <!-- daypilot libraries --> <script src="js/daypilot/daypilot-all.min.js" type="text/javascript"></script> <link type="text/css" rel="stylesheet" href="media/layout.css" /> </head> <body> <div id="header"> <div class="bg-help"> <div class="inbox"> <hr class="hidden" /> </div> </div> </div> <div class="shadow"></div> <div class="hideskiplink"> </div> <div class="main"> <div ng-app="main" ng-controller="democtrl" > <div style="float:left; width: 160px"> <daypilot-navigator id="navi" daypilot-config="navigatorconfig" ></daypilot-navigator> </div> <div style="margin-left: 160px"> <div class="space"> <button ng-click="showday()">day</button> <button ng-click="showweek()">week</button> </div> <daypilot-calendar id="day" daypilot-config="dayconfig" daypilot-events="events" ></daypilot-calendar> <daypilot-calendar id="week" daypilot-config="weekconfig" daypilot-events="events" ></daypilot-calendar> </div> </div> <script> var app = angular.module('main', ['daypilot']).controller('democtrl', function($scope, $timeout, $http) { $scope.events = []; $scope.navigatorconfig = { selectmode: "day", showmonths: 3, skipmonths: 3, ontimerangeselected: function(args) { $scope.weekconfig.startdate = args.day; $scope.dayconfig.startdate = args.day; loadevents(); } }; $scope.dayconfig = { viewtype: "day", ontimerangeselected: function(args) { var params = { start: args.start.tostring(), end: args.end.tostring(), text: "new event" }; $http.post("backend_create.php", params).success(function(data) { $scope.events.push({ start: args.start, end: args.end, text: "new event", id: data.id }); }); }, oneventmove: function(args) { var params = { id: args.e.id(), newstart: args.newstart.tostring(), newend: args.newend.tostring() }; $http.post("backend_move.php", params); }, oneventresize: function(args) { var params = { id: args.e.id(), newstart: args.newstart.tostring(), newend: args.newend.tostring() }; $http.post("backend_move.php", params); }, oneventclick: function(args) { var modal = new daypilot.modal({ onclosed: function(args) { if (args.result) { // args.result empty when modal closed without submitting loadevents(); } } }); modal.showurl("edit.php?id=" + args.e.id()); } }; $scope.weekconfig = { visible: false, viewtype: "week", ontimerangeselected: function(args) { var params = { start: args.start.tostring(), end: args.end.tostring(), text: "new event" }; $http.post("backend_create.php", params).success(function(data) { $scope.events.push({ start: args.start, end: args.end, text: "new event", id: data.id }); }); }, oneventmove: function(args) { var params = { id: args.e.id(), newstart: args.newstart.tostring(), newend: args.newend.tostring() }; $http.post("backend_move.php", params); }, oneventresize: function(args) { var params = { id: args.e.id(), newstart: args.newstart.tostring(), newend: args.newend.tostring() }; $http.post("backend_move.php", params); }, oneventclick: function(args) { var modal = new daypilot.modal({ onclosed: function(args) { if (args.result) { // args.result empty when modal closed without submitting loadevents(); } } }); modal.showurl("edit.php?id=" + args.e.id()); } }; $scope.showday = function() { $scope.dayconfig.visible = true; $scope.weekconfig.visible = false; $scope.navigatorconfig.selectmode = "day"; }; $scope.showweek = function() { $scope.dayconfig.visible = false; $scope.weekconfig.visible = true; $scope.navigatorconfig.selectmode = "week"; }; loadevents(); function loadevents() { // using $timeout make sure changes applied before reading visiblestart() , visibleend() $timeout(function() { var params = { start: $scope.week.visiblestart().tostring(), end: $scope.week.visibleend().tostring() } $http.post("backend_events.php", params).success(function(data) { $scope.events = data; }); }); } }); </script> </div> <div class="clear"> </div> </body> </html> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
i still confused why problem occurring again , again
you should check response returned "backend_events.php". daypilot expects array of events in json format. if there server-side error in script response return error message instead.
most likely, there problem permissions on server side - php script needs read/write permissions daypilot.sqlite file in application root.
Comments
Post a Comment