Change Weekly Formating "Week X" To Date Mm/Dd/Yyyy

[intapiuser]

In some cases a user may want to present his weeks in the format of the first day of the week date.

The issue is once you change the format it will show you the date of the 4th day of the business week.

1. Week format

2. Change Format

3. Add the following script to the Widget Edit Script

widget.on('ready', function(){
 $.each($("tbody .p-head-content span",element), function(){
  var span = this.textContent;
  var new_date =  new Date(span);
  new_date.setDate(new_date.getDate() - 3)
  new_date =  (new_date.getMonth()+1)  +'/'+ new_date.getDate()+ '/'+ new_date.getFullYear();
  this.textContent = new_date;
 });
});

For line chart you can use this script

widget.on('processresult', function(widget, args ){
var dates = args.result.xAxis.categories;
var new_dates = [];
dates.forEach(function(category){
 var new_date = new Date(category);
 new_date.setDate(new_date.getDate() - 3);
 new_date = (new_date.getMonth()+1) +'/'+ new_date.getDate()+ '/'+ new_date.getFullYear();
 new_dates.push(new_date)
});
 args.result.xAxis.categories = new_dates;

});

When you want to drill into Days, you will not want to apply the same formatting as this would adjust each day back by 3.

Therefore, you can use the following extension of script to enable drilling into Days from Weeks, while maintaining correct week formatting, without breaking the day specification:

var convFlag; 
var dateCol = 0; //set this to the index of the Date Field (i.e. column #1 is index 0)

widget.on('processresult', function(se,ev){ 
var dateType = ev.result.fields[dateCol].id; 
if(dateType.includes('week')){ 
 
convFlag = 1 
} 
else{ 

convFlag = 0; 
}

});

widget.on('ready', function(){

if(convFlag == 1){ 
$.each($("tbody .p-head-content span",element), function(){ 
var span = this.textContent; 
var new_date = new Date(span); 
new_date.setDate(new_date.getDate() - 3) 
new_date = (new_date.getMonth()+1) +'/'+ new_date.getDate()+ '/'+ new_date.getFullYear(); 
this.textContent = new_date; 
}); 
} 
});