RadCalendar causing Postbacks

[Kent]

I have two RadCalendars inside a <div>. I want to be able to hide/show this div with jQuery, however anytime the <div> is shown/hidden the controls are causing a postback, which resets the state of the calendars. This even though the AutoPostBack property is set to "false" (both in the .aspx attribute, and Page_Load of code-behind. WHY? And how can I stop this behavior?

<div id="calendars" style="width: 450px" >
    <div style="float: left">
        <telerik:RadCalendar ID="dpStart" runat="server" AutoPostBack="false"
                                             UseColumnHeadersAsSelectors="False" UseRowHeadersAsSelectors="False" EnableMultiSelect="False"
                                             ShowFastNavigationButtons="False" ShowRowHeaders="False"
                                             RangeMaxDate="2050-12-31" RangeMinDate="2008-01-01" FocusedDate="2008-01-01"
                                             SelectedDate="" Skin="Metro" ViewSelectorText="x" >
                            <ClientEvents OnDateSelected="dpStart_OnDateSelected" OnCalendarViewChanging="OnCalendarViewChanging" />
                        </telerik:RadCalendar>
                    </div>

                    <div style="float: right">
                        <telerik:RadCalendar ID="dpEnd" runat="server" AutoPostBack="false"
                                             UseColumnHeadersAsSelectors="False" UseRowHeadersAsSelectors="False" EnableMultiSelect="False"
                                             ShowFastNavigationButtons="False" ShowRowHeaders="False"
                                             RangeMaxDate="2050-12-31" RangeMinDate="2008-01-01" FocusedDate="2008-01-01"
                                             SelectedDate="" Skin="Metro" ViewSelectorText="x" >
                            <ClientEvents OnDateSelected="dpStart_OnDateSelected" OnCalendarViewChanging="OnCalendarViewChanging" />
                        </telerik:RadCalendar>
     </div>
</div>

 <button id="button">Toggle</button>

<script type="text/javascript">
    $("#button").click(function() {
        $("#calendars").toggle();
     });
</script>

[Vasil]

Hi Kent,

The problem is not in the calendar itself.
Actually the button makes Postback, because it's click event is never canceled.

Try your code like:

    <script type="text/javascript">
      $("#button").click(function ()
      {
        $("#calendars").toggle(); return false;
      });
</script>

All the best,
Vasil
the Telerik team