Rad Calendar OnDateSelected in .Net not keeping styles

[Carlos]

I have a RadCalendar we are using and when I add the 'OnDateSelected' Client event I have a function that adds styles and a hide() via jQuery to other elements on the page.  
It seems that on the date selection the 'OnDateSelected' client event is not behaving as I thought it would be.  I thought that I would be able to add a .hide() via jQuery to an element because the date selected was finished. But it seem that after the post back of the date selection my .hide() does not trigger.

What I am doing is I have a <div> that triggers my Calendar to show() via jQuery.  What I want is when the date is selected I want the Calendar to .hide() via jQuery.  Any help is much appreciated. Thanks.


This is my code in my .ascx control:

<ClientEvents OnDateSelected="HideCalendarEnableTimes" />

<div>Click to show Calendar</div>
<telerik:RadCalendar CssClass="myCalendar">..all the good stuff here</telerik:RadCalendar>

<option disabled class="timeListBox">List of times here</option>


//jQuery below

function HideCalendarEnableTimes(sender, eventArgs) {
// alert('enable times');
$('.timeListBox').prop('disabled', false).removeClass('disabled');
$('table.RadCalendar_Special').hide();
$('#MuseumSelectedDayBox').addClass('chosen');
}

[Shinu]

Hi Carlos,

Please have a look into the sample code snippet to Hide/Show the RadCalendar using JQuery.

ASPX:

<div id="calendardiv" runat="server">
    Click to show calendar
</div>
<telerik:RadCalendar ID="RadCalendar" runat="server" Style="display: none">
    <ClientEvents OnDateSelected="HideCalendar" />
</telerik:RadCalendar>

JavaScript:

<script type="text/javascript">
    $("#calendardiv").click(function () {
        $("#RadCalendar").show();
    });
    function HideCalendar(sender, args) {
        $("#RadCalendar").hide();
    }
</script>

Let me know if you have any concern.
Thanks,
Shinu.

[Carlos]

@Shinu,
That fixed that issue. I have one more though.  I also need the Calendar to stay shown when a user selects the Next or Previous month.  

Same HTML and .Net as above but I am using the OnCalendarViewChanged client event. Is this possible to get the calendar to stay shown if the calendar goes to the next month?
As it is written now with the display:none, the calendar always hides again when the Next or Previous month is chosen. 

 <!--Is this correct to use for month change?-->
<ClientEvents OnCalendarViewChanged="MonthChangeShow" />

//jQuery - but not working. Hides after the calendar calendar loads again.
function MonthChangeShow(sender, eventArgs){
$('table.RadCalendar_Special').show();
}

[Carlos]

Or I thought this would work too but it does not.

$(document).on('click', '.rcPrev, .rcNext', function () {
     $('table.RadCalendar_Special').show();
});

[Carlos]

Oh and I should mention that AutoPostback is set to True.  This might complicate a few things on what I am trying to do. Hmmm

[Shinu]

Hi Carlos,

Setting Visibility of a control from client side will not persist after postback. There is a conflict between setting visibility from client side and setting AutoPostBack to true of a Control. So as a suggestion either you can set the visibility of a control from the server side or you can do a conditional postback based on your requirement.

Thanks,
Shinu.