0

I am building a SharePoint-hosted app in SharePoint. Basicaly it is a time planning app. I used a jquery calendar plugin (fullcalendar). My question is I have a "lock" button. When user clicks the button it should make the calendar days unselectable (only the days in the current month). Appreciate if someone can help me with it.

I was trying like this.

function LockMonth() {
    var schedulecCalendar = $('#myCalendar').fullCalendar({
        selectable: false,

    });
}

When I run the app I can click on the calendar day and add event from the textbox to the calendar. But once I click on "lock" button then it should make the calendar unselectable. But It doesn't work.

1

Hi i have just put up a fiddle for you,updated fiddle hope that helps

SCRIPT

 $('#mycalendar').fullCalendar(
            {
             header: {
                    left: 'prev,next today',
                    center: 'title',
                    right: 'month,agendaWeek,agendaDay'
                    },

             dayClick: function( date, allDay, jsEvent, view ) { 
                    var myDate = new Date();
                    var isLocked=document.getElementById("locked")
                    var currMonth = getCurrentDisplayedMonth()
                    var blockedMonths = getMonthsBlockedByUserFromList();   
                    alert($.inArray(currMonth,blockedMonths))
                    if ($.inArray(currMonth,blockedMonths) != -1) {
                       alert("You cannot book on this day!");   
                         return 
                    }
                    else
                    {
                        alert("Excellent choice! We can book today..");    
                     }   
                 },      

             events: [
                        {
                            title  : 'event2',
                            start  : '2011-03-10',
                            end    : '2011-05-5'
                        }
                    ]
         }); 


$('#btnlocked').click(function(){
    //add the month to blocked list 
 var isLocked=document.getElementById("locked")
 if(isLocked.value=="false") {   
     isLocked.value=true;
    $('#btnlocked').val("Unlock Month")
         alert('Month locked')
    }
  else{
     isLocked.value=false;
    $('#btnlocked').val("Lock Month")
         alert('Month unlocked')
    }
});

function getMonthsBlockedByUserFromList(){
  //retrieve all months for the year blocked by respective user from SP list
  // return array of months blocked(0= Jan,1=Feb...4=May and so on) 
  //suppose follwing months are blocked
    var monthsBlockedByXyz= [0,4,5,6];
     return monthsBlockedByXyz;
}

function getCurrentDisplayedMonth(){
  var date = $("#mycalendar").fullCalendar('getDate');
  var month_int = date.getMonth();
    return month_int;
  //you now have the visible month as an integer from 0-11
}

HTML

<input type="hidden" id="locked" value="false"/>
<input type="button" id="btnlocked" value="Lock month"/>
<div id="mycalendar"> Calendar </div>
  • Thank you for your code I really appreciate it. It worked for only the current month but I want to lock some specific month as well like past month februari or future month october. How can I lock independently different months? – Sunreuz May 18 '15 at 16:06
  • yes i had made it for current month, can you tell me how you determine which month to blocks so that i would modify the code – Akshay Randive May 18 '15 at 16:22
  • Once the user lock the current month, notification will be sent to the admin and the user will no longer make any change in the calendar unless the admin gives him the right to do so. This is monthly activity and the user should be able to lock(submit) for subsequent months as well. – Sunreuz May 18 '15 at 18:37
  • Let me know if something is unclear. – Sunreuz May 18 '15 at 21:18
  • I just have a doubt where do you plan to save/store the data when xyz month is been locked by a particular user. – Akshay Randive May 19 '15 at 4:47

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.