RadCalendar causing Postbacks

2 posts, 0 answers
  1. Kent
    Kent avatar
    1 posts
    Member since:
    Apr 2011

    Posted 25 Feb 2012 Link to this post

    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>
  2. Vasil
    Admin
    Vasil avatar
    1547 posts

    Posted 27 Feb 2012 Link to this post

    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
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top