Agent-readable demo data

Title

Excel Export (JavaScript Monthly Calendar) | DayPilot Pro for JavaScript Demo

Tree

DayPilot JavaScript Demo

Catalog root

Default

Description

Read more about client-side Excel export.

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

Inline demo script 1

const dp = new DayPilot.Month("dp", {
            startDate: DayPilot.Date.today(),
            eventBarVisible: false,
            onTimeRangeSelected: async (args) => {
                const modal = await DayPilot.Modal.prompt("New event name:", "Event");
                dp.clearSelection();
                if (!modal.result) return;
                dp.events.add({
                    start: args.start,
                    end: args.end,
                    id: DayPilot.guid(),
                    text: modal.result
                });
                dp.message("Created");
            },
            onBeforeEventRender: args => {
                args.data.backColor = "#6aa84f";
                args.data.fontColor = "#ffffff";
                args.data.borderColor = "#3d6f3d";
            },
            exceljs: ExcelJS
        });
        dp.init();

        const app = {
            elements: {
                downloadButton: document.getElementById("download-button"),
                area: document.getElementById("area"),
            },
            init: function () {
                this.elements.downloadButton.addEventListener("click", (ev) => {
                    ev.preventDefault();
                    dp.exportAs("xlsx").download();
                });

                this.loadEventData();
            },
            loadEventData() {
                const events = [];
                let start = DayPilot.Date.today().firstDayOfMonth();
                for (let i = 0; i < 10; i++) {
                    const add = Math.floor(Math.random() * 2);
                    // const add = 1;
                    start = start.addDays(add);
                    if (start.getDayOfWeek() === 6) {
                        start = start.addDays(2);
                    }
                    if (start.getDayOfWeek() === 0) {
                        start = start.addDays(1);
                    }

                    const duration = Math.floor(Math.random() * 3) + 1;
                    events.push({
                        start: start,
                        end: start.addDays(duration),
                        id: DayPilot.guid(),
                        text: "Event " + (i + 1)
                    });
                }
                dp.update({events});
            },
        };
        app.init();