Customize SharePoint Calendar Days Name using jQuery
How to Customize SharePoint Calendar Days Name using jQuery
Step1: Create a page and calendar list to it.
Step2: Now add Script Editor Web Part to it and paste the below code.
Code-
<script src="//code.jquery.com/jquery-3.2.1.min.js"></script>
<script type="text/javascript">
//execute the script only when the calendar JS file loads
LoadSodByKey("SP.UI.ApplicationPages.Calendar.js", function () {
WaitForCalendarToLoad();
});
function WaitForCalendarToLoad() {
//running your function for the first time IF YOU NEED TO!
ChangeDaysName();
var _onItemsSucceed =
SP.UI.ApplicationPages.CalendarStateHandler.prototype.onItemsSucceed;
SP.UI.ApplicationPages.CalendarStateHandler.prototype.onItemsSucceed =
function($p0, $p1) {
_onItemsSucceed.call(this, $p0, $p1);
//now let it call your function each time the calendar is loaded
ChangeDaysName();
}
}
function ChangeDaysName(){
$("table.ms-acal-month > tbody > tr > th.ms-acal-month-top").each(function(){
//get the first 3 chars from day name
$cell = $(this).text().substring(0,3);
$(this).text($cell);
});
}
</script>
Step1: Create a page and calendar list to it.
Step2: Now add Script Editor Web Part to it and paste the below code.
Code-
<script src="//code.jquery.com/jquery-3.2.1.min.js"></script>
<script type="text/javascript">
//execute the script only when the calendar JS file loads
LoadSodByKey("SP.UI.ApplicationPages.Calendar.js", function () {
WaitForCalendarToLoad();
});
function WaitForCalendarToLoad() {
//running your function for the first time IF YOU NEED TO!
ChangeDaysName();
var _onItemsSucceed =
SP.UI.ApplicationPages.CalendarStateHandler.prototype.onItemsSucceed;
SP.UI.ApplicationPages.CalendarStateHandler.prototype.onItemsSucceed =
function($p0, $p1) {
_onItemsSucceed.call(this, $p0, $p1);
//now let it call your function each time the calendar is loaded
ChangeDaysName();
}
}
function ChangeDaysName(){
$("table.ms-acal-month > tbody > tr > th.ms-acal-month-top").each(function(){
//get the first 3 chars from day name
$cell = $(this).text().substring(0,3);
$(this).text($cell);
});
}
</script>
Comments
Post a Comment