Hi all,

I recently built a custom dashboard with the help of Sebastiaan in this post:

http://our.umbraco.org/forum/umbraco-7/using-umbraco-7/60887-Custom-dashboard-Umbraco-update-service

However, I have now modified my code in an attempt to make the interface more user friendly by including a datepicker on two fields so that our users can pass two dates into our web services and have a result returned.

The problem is, I am receiving the following Javascript errors in Firebug when I try and access my Dashboard in the back office:

Error: Argument 'AxumUpdateService' is not a function, got undefined cb@http://localhost:60282/umbraco/lib/angular/1.1.5/angular.min.js:17:79 xa@http://localhost:60282/umbraco/lib/angular/1.1.5/angular.min.js:17:187 Jc/this.$get

http://localhost:60282/umbraco/lib/angular/1.1.5/angular.min.js Line 63

At first I thought it was due to some of my Javascript causing a conflict but I have checked it and there are no missing semicolons or errors in the code.

I then checked my package.manifest to ensure that Jquery was called before AngularJS as this is advised on most forums however, this still hasn't helped with this issue.

Does anybody know how to circumvent these issues?

package.manifest

{
  javascript:[
    "~/app_plugins/Dashboards/jquery-1.11.2.min.js,
    "~/app_plugins/Dashboards/css/jquery-ui.min.js",
    "~/app_plugins/Dashboards/AxumUpdateServiceJquery.js",
    "~/app_plugins/Dashboards/AxumUpdateService.controller.js",
    "~/app_plugins/Dashboards/AxumUpdateService.service.js",
  ],
  css:[
    "~/app_plugins/Dashboards/css/axumupdateservice.min.css",
    "~/app_plugins/Dashboards/css/jquery-ui.min.css"
  ]
}

AxumUpdateService.service.js

angular.module("umbraco.services").factory("AxumUpdateService", function ($http) {
    return {
        getAll: function (from, to) {
            from = from || "";
            to = to || "";
            return $http.get("/umbraco/api/Axum/GetAllGroupTours" + "?fromDate=" + from + "&toDate=" + to);
        }
    }
});

AxumUpdateService.controller.js

angular.module("umbraco")
    .controller("AxumUpdateService",
    function ($scope, $http, AxumUpdateService) {
        $scope.getAll = function () {
            $scope.load = true;
            $scope.info = "Retreiving updates";
            AxumUpdateService.getAll($scope.fromDate, $scope.toDate).success(function (data) {
                $scope.result = data;
                $scope.info = data;
                $scope.load = false;
            });
        };
    });

AxumUpdateServiceJquery.js

$(document).ready(function () {
    $(".datepicker").datepicker();
});