Agent-readable demo data

Title

AngularJS Gantt Chart | DayPilot Pro for JavaScript Demo

Tree

DayPilot JavaScript Demo

Catalog root

Default

Description

Read more about the AngularJS Gantt Chart.

• Canonical HTML: /demo/gantt/angularjs.html
• Markdown companion: /demo/gantt/angularjs.md
• Folder: /demo/gantt/
• Root: /demo/
• Catalog: /demo/llms.txt

Inline demo script 1

var app = angular.module('main', ['daypilot']).controller('DemoCtrl', function ($scope) {

            //$scope.config = {};

            $scope.config = {
                scale: "Day",
                startDate: "2014-09-01",
                days: 30,
                timeHeaders: [
                    {groupBy: "Month"},
                    {groupBy: "Day", format: "d"}
                ],
                tasks: [
                    {
                        start: new DayPilot.Date("2014-09-05T00:00:00"),
                        end: new DayPilot.Date("2014-09-06T00:00:00"),
                        id: DayPilot.guid(),
                        text: "One-Day Task"
                    }
                ]
            };

            $scope.add = function () {
                $scope.config.tasks.push(
                    {
                        start: new DayPilot.Date("2014-09-05T00:00:00"),
                        end: new DayPilot.Date("2014-09-06T00:00:00"),
                        id: DayPilot.guid(),
                        text: "One-Day Task"
                    }
                );
            };

            $scope.move = function () {
                var task = $scope.config.tasks[0];
                task.start = task.start.addDays(1);
                task.end = task.end.addDays(1);
            };

            $scope.rename = function () {
                $scope.config.tasks[0].text = "New name";
            };

            $scope.message = function () {
                $scope.dp.message("Hi");
                //console.log($scope.dp);
            };

        });