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>

Comments

Popular posts from this blog

Customizing SharePoint list and implementing Quick search using jQuery

Enable and Disable Client side People Picker using jQuery

How to generate PDF using jsPDF and html2canvas library