none
Calendar Showing only Work Week?

    Question

  • Hello,

    Is there a way to make a SharePoint Calendar show only Mon-Friday without Sat-Sun all together?  Or a way to toggle it on and off?  I have SPD 2010 if that will be a help on how to create this.  Please advise.  Thank you.

    -Derek S.
    Wednesday, February 3, 2016 6:43 PM

Answers

  • Hi,

    You can create a new view > select Calendar View > select Week option in the Default Scope field.

    In the new view page, you need to insert a Content Editor Web Part and add the following code in it:

    <script src="http://code.jquery.com/jquery-1.11.3.min.js" type="text/javascript"></script>
    
    <script type="text/javascript">
    
    $().ready(function(){
    
    
           var cal = $('.ms-acal-detail');
    
           // Loop through the Calendar Table and find the relevant columns.
    
           cal.find('tr').each(function () {
    
                  // If it is the header we will remove the Saturday and Sunday from the TH Section.
    
                  if($(this).hasClass("ms-acal-week-top"))
    
                  {
    
                         // In the first row we remove the weekdays Saturnday and Sunday.
    
                         // Located at position 5 Saturday and 6 Sunday.
    
                         $(this).closest("tr").find("td:eq(" + 6 + ")").remove();
    
                         $(this).closest("tr").find("td:eq(" + 0 + ")").remove();
    
    
                  }else
    
                  {
    
                         // We dont have the headers anymore so we can remove the rest of the cells as well, that we dont have empty columns.
    
                         $(this).closest("tr").find("td:eq(6)").remove();
    
                         $(this).closest("tr").find("td:eq(5)").remove();
    
                  }
    
           });
    
    });</script>
    

    How to add JavaScript to Content Editor Web Part for your reference:

    http://www.nothingbutsharepoint.com/2011/05/09/adding-script-into-a-content-editor-web-part-cewp-in-sharepoint-2010-aspx/

    Thanks,

    Dean Wang


    TechNet Community Support
    Please remember to mark the replies as answers if they help, and unmark the answers if they provide no help. If you have feedback for TechNet Support, contact tnmff@microsoft.com.

    Thursday, February 4, 2016 9:17 AM
    Moderator
  • Hi

    check this real example

    http://www.c-sharpcorner.com/UploadFile/313769/how-to-gray-out-saturday-and-sunday-in-sharepoint-calendar/

    if you want to hide in all your web app, use a custom css file and ionsert there your changes

    If don't , apply new styles directly in the page


    Romeo Donca, Orange Romania (MCSE, MCITP, CCNA) Please Mark As Answer if my post solves your problem or Vote As Helpful if the post has been helpful for you.

    Thursday, February 4, 2016 9:38 AM

All replies

  • Hi,

    You can create a new view > select Calendar View > select Week option in the Default Scope field.

    In the new view page, you need to insert a Content Editor Web Part and add the following code in it:

    <script src="http://code.jquery.com/jquery-1.11.3.min.js" type="text/javascript"></script>
    
    <script type="text/javascript">
    
    $().ready(function(){
    
    
           var cal = $('.ms-acal-detail');
    
           // Loop through the Calendar Table and find the relevant columns.
    
           cal.find('tr').each(function () {
    
                  // If it is the header we will remove the Saturday and Sunday from the TH Section.
    
                  if($(this).hasClass("ms-acal-week-top"))
    
                  {
    
                         // In the first row we remove the weekdays Saturnday and Sunday.
    
                         // Located at position 5 Saturday and 6 Sunday.
    
                         $(this).closest("tr").find("td:eq(" + 6 + ")").remove();
    
                         $(this).closest("tr").find("td:eq(" + 0 + ")").remove();
    
    
                  }else
    
                  {
    
                         // We dont have the headers anymore so we can remove the rest of the cells as well, that we dont have empty columns.
    
                         $(this).closest("tr").find("td:eq(6)").remove();
    
                         $(this).closest("tr").find("td:eq(5)").remove();
    
                  }
    
           });
    
    });</script>
    

    How to add JavaScript to Content Editor Web Part for your reference:

    http://www.nothingbutsharepoint.com/2011/05/09/adding-script-into-a-content-editor-web-part-cewp-in-sharepoint-2010-aspx/

    Thanks,

    Dean Wang


    TechNet Community Support
    Please remember to mark the replies as answers if they help, and unmark the answers if they provide no help. If you have feedback for TechNet Support, contact tnmff@microsoft.com.

    Thursday, February 4, 2016 9:17 AM
    Moderator
  • Hi

    check this real example

    http://www.c-sharpcorner.com/UploadFile/313769/how-to-gray-out-saturday-and-sunday-in-sharepoint-calendar/

    if you want to hide in all your web app, use a custom css file and ionsert there your changes

    If don't , apply new styles directly in the page


    Romeo Donca, Orange Romania (MCSE, MCITP, CCNA) Please Mark As Answer if my post solves your problem or Vote As Helpful if the post has been helpful for you.

    Thursday, February 4, 2016 9:38 AM