Pending Review
Last Updated: 19 Mar 2018 14:35 by ADMIN
ADMIN
Peter Milchev
Created on: 19 Mar 2018 14:35
Category: Gantt
Type: Feature Request
1
Allow templates for HeaderDateFormat in RadGantt
Currently, the RadGantt allows only format strings as a value for the WeekHeaderDateFormat property. 

Use case - show week number instead of the dates. 

Workaround to show week number: The suggestion is based on the https://demos.telerik.com/aspnet-ajax/gantt/examples/accessibility-and-internationalization/localization/defaultcs.aspx demo. 

What you should add to the Gantt markup declaration is the WeekView-WeekHeaderDateFormat="dd/MM/yyyy" and OnClientDataBound="OnClientDataBound" properties. 

// https://stackoverflow.com/questions/6117814/get-week-of-year-in-javascript-like-in-php
function getWeekNumber(d) {
    // Copy date so don't modify original
    d = new Date(Date.UTC(d.getFullYear(), d.getMonth(), d.getDate()));
    // Set to nearest Thursday: current date + 4 - current day number
    // Make Sunday's day number 7
    d.setUTCDate(d.getUTCDate() + 4 - (d.getUTCDay() || 7));
    // Get first day of year
    var yearStart = new Date(Date.UTC(d.getUTCFullYear(), 0, 1));
    // Calculate full weeks to nearest Thursday
    var weekNo = Math.ceil((((d - yearStart) / 86400000) + 1) / 7);
    // Return array of year and week number
    // return [d.getUTCFullYear(), weekNo];
    return weekNo
}
function OnClientDataBound(sender, args) {
    if (sender.get_viewsData()[sender.get_selectedView()].type == "week") {
        $telerik.$('.rgtTimelineWrapper thead>tr:first .radHeader', sender.get_element()).each(function (index) {
            var $this = $(this)
            var datestring = $this.text().substring(0, 10);
            var date = new Date(datestring);
            var weekNumber = getWeekNumber(date)
            $this.text("Week " + weekNumber)
        })
    }
}
0 comments