Disable RJS Pop Calendar using Client-Side Script

In this blog you will learn to disable and enable RJS pop calendar using client-side script (javascript).

Hi Folks,

 

If you have used RJS Pop Calendar in your project, you must have faced a problem of toggling (enable or disable) the pop calendar using a client-side script like javascript. Here is a simple solution for the same.

 

Steps

1. Include the below javascript in your page: 

   function ToggleCalender()
   {
        var chkToggleCal = document.getElementById('<%= chkToggleCal.ClientID %>');
        var spanCal = document.getElementById('<%= PopCalDate.ClientID %>' + '_Control');
        var imgCal = spanCal.getElementsByTagName("img");
   
        if (chkToggleCal.checked)
        {
               imgCal[0].src = "PopCalendar2005/Calendar.gif";
               spanCal.onclick = function ShowCal()
               {
                    __PopCalShowCalendar('<%= txtCal.ClientID %>', this);
               };
        }
        else
        {
               imgCal[0].src = "PopCalendar2005/DisableCalendar.gif";
               spanCal.onclick = function LockCal()
              {
   
              };
        }
   }

2. Include the following lines of code in your Code-Behind page in your page_load event:

   if (!Page.IsPostBack)
   {
          chkToggleCal.Attributes.Add("onclick", "javascript:ToggleCalender();");
   }

To modify the above mentioned script, you need to know the following:

• chkToggleCal: ASP.NET Control which will enable or disable pop calendar.
• PopCalDate: Pop calendar control you want to enable or disable.
• txtCal: ASP.NET Control mentioned in Control property of Pop Calendar.

Attached is a sample application to demonstrate the working of this script.

 

Now, you can toggle the state of the pop calendar from the client script. Feel free to provide your comments.