This is a migrated thread and some comments may be shown as answers.

Hiding and Showing RadScheduler

1 Answer 82 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
Scott
Top achievements
Rank 1
Scott asked on 24 Aug 2010, 09:41 PM
I'm trying to be able to hide and show a RadScheduler on demand. I'm fairly sure this is a client side scripting question.

The first problem I was having was hiding the scheduler on page load. It would hide ok, but when shown, it would be empty. I solved this by calling repaint() after showing its wrapper div.

Now the problem is even though its showing ok, appointments cannot be dragged and dropped.

Specifically, if the RadScheduler is hidden, and an Ajax call is made which rebinds the data, lets say an appointment is moved back two weeks, when the wrapper div is shown and the scheduler is repainted, it does show the appointment on the correct new date, however it is no longer dragable.

Is there another client side method I can call that will reenable dragging support?

Thanks,

<asp:Content ID="Content1" ContentPlaceHolderID="cphHead" Runat="Server">
<script type="text/javascript">
    var rsEvents = null;
    var rgEvents = null;
    var rsPastEvents = null;
    var rgPastEvents = null;
    function onResponseEnd(sender, args) {
        if (args.EventTarget.replace(/\$/g, '_') == rgEvents.ClientID || args.EventTarget == rgPastEvents.ClientID) {
            $('#schedEvents').data('nr', true);
            $('#schedPastEvents').data('nr', true);
        }
    }
    $(document).ready(function () {
        $('#evtCalBtn').click(function () {
            $('#schedEvents').toggle('blind', {}, 500, null);
            if ($('#schedEvents').data('nr') == true) {
                rsEvents.repaint();
                rsEvents.rebind();
            }
        });
        $('#pastEvtCalBtn').click(function () {
            $('#schedPastEvents').toggle('blind', {}, 500, null);
            if ($('#schedPastEvents').data('nr') == true) {
                rsPastEvents.repaint();
                rsEvents.rebind();
            }
        });
    });
 
    $(window).load(function () {
        $('#schedEvents').hide();
        $('#schedPastEvents').hide();
 
        rsEvents = $find('<%= rsEvents.ClientID %>');
        rgEvents = $find('<%= rgEvents.ClientID %>');
        rsPastEvents = $find('<%= rsPastEvents.ClientID %>');
        rgPastEvents = $find('<%= rgPastEvents.ClientID %>');
        $('#schedEvents').data('nr', false);
        $('#schedPastEvents').data('nr', false);
    });
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="cphBody" Runat="Server">
 
<div>
    <div class="acnt">
    <p>Upcoming Events <span id="evtCalBtn" class="viewCalender">(View Calendar)</span></p>
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="rgEvents">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="rsEvents" UpdatePanelHeight="" />
                        <telerik:AjaxUpdatedControl ControlID="rgPastEvents" UpdatePanelHeight="" />
                        <telerik:AjaxUpdatedControl ControlID="rsPastEvents" UpdatePanelHeight="" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="rsEvents">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="rgEvents" UpdatePanelHeight="" />
                        <telerik:AjaxUpdatedControl ControlID="rgPastEvents" UpdatePanelHeight="" />
                        <telerik:AjaxUpdatedControl ControlID="rsPastEvents" UpdatePanelHeight="" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="rgPastEvents">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="rgEvents" UpdatePanelHeight="" />
                        <telerik:AjaxUpdatedControl ControlID="rsEvents" UpdatePanelHeight="" />
                        <telerik:AjaxUpdatedControl ControlID="rsPastEvents" UpdatePanelHeight="" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="rsPastEvents">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="rgEvents" UpdatePanelHeight="" />
                        <telerik:AjaxUpdatedControl ControlID="rsEvents" UpdatePanelHeight="" />
                        <telerik:AjaxUpdatedControl ControlID="rgPastEvents" UpdatePanelHeight="" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
            <ClientEvents OnResponseEnd="onResponseEnd" />
        </telerik:RadAjaxManager>  
            <telerik:RadGrid ID="rgEvents" runat="server" AllowSorting="True"
                    AutoGenerateColumns="False" DataSourceID="sqldsEvents" GridLines="None"
                    Skin="Windows7" onitemcommand="rgEvents_ItemCommand" AllowPaging="True">
                <MasterTableView DataKeyNames="EventID" DataSourceID="sqldsEvents">
                <CommandItemSettings ExportToPdfText="Export to Pdf"></CommandItemSettings>
                    <Columns>
                        <telerik:GridBoundColumn DataField="EventID" DataType="System.Int32"
                            HeaderText="EventID" ReadOnly="True" SortExpression="EventID"
                            UniqueName="EventID" Visible="False">
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="StartDT" DataFormatString="{0:MM-dd-yyyy}"
                            DataType="System.DateTime" HeaderText="StartDT" SortExpression="Date"
                            UniqueName="StartDT">
                            <HeaderStyle Width="60px" />
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="EventName" HeaderText="EventName"
                            SortExpression="Event" UniqueName="EventName">
                            <HeaderStyle Width="100%" />
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="Seats" DataType="System.Int32"
                            HeaderText="Seats" SortExpression="# Seats" UniqueName="Seats">
                            <HeaderStyle Width="40px" />
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="SeatsLeft" DataType="System.Int32"
                            HeaderText="SeatsLeft" ReadOnly="True" SortExpression="# Left"
                            UniqueName="SeatsLeft">
                            <HeaderStyle Width="40px" />
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="Cost" DataFormatString="{0:$#,0.00}"
                            DataType="System.Decimal" HeaderText="Cost" SortExpression="Cost"
                            UniqueName="Cost">
                            <HeaderStyle Width="60px" />
                        </telerik:GridBoundColumn>
                        <telerik:GridHyperLinkColumn AllowFiltering="False" Groupable="False"
                            Reorderable="False" Resizable="False" ShowSortIcon="False" Target="_blank"
                            Text="View" UniqueName="colView" DataNavigateUrlFields="EventID"
                            DataNavigateUrlFormatString="../../events.aspx?id={0}">
                            <ItemStyle Font-Size="7pt" />
                        </telerik:GridHyperLinkColumn>
                        <telerik:GridButtonColumn CommandName="Delete" Text="Delete"
                            UniqueName="colDelete"
                            ConfirmText="Are you sure you want to cancel this event? You should send an email notiying them of the cancelation before continuing."
                            ConfirmTitle="Question">
                            <ItemStyle Font-Size="7pt" />
                        </telerik:GridButtonColumn>
                        <telerik:GridButtonColumn CommandName="Email" Text="Email"
                            UniqueName="colEmail">
                            <ItemStyle Font-Size="7pt" />
                        </telerik:GridButtonColumn>
                        <telerik:GridButtonColumn CommandName="Copy" Text="Copy"
                            UniqueName="colCopy">
                            <ItemStyle Font-Size="7pt" />
                        </telerik:GridButtonColumn>
                        <telerik:GridButtonColumn CommandName="Manage" Text="Manage"
                            UniqueName="colManage">
                            <ItemStyle Font-Size="7pt" />
                        </telerik:GridButtonColumn>
                    </Columns>
                </MasterTableView>
            </telerik:RadGrid>
 
        <div id="schedEvents" style="display: block">
            <telerik:RadScheduler runat="server" ID="rsEvents" Height="580px" Width="100%"
                SelectedView="MonthView" ShowViewTabs="False"
            ShowNavigationPane="True" DataEndField="EndDT" DataKeyField="EventID"
            DataSourceID="sqldsEvents" DataStartField="StartDT"
            DataSubjectField="EventName" Skin="Windows7"
            onappointmentupdate="rsEvents_AppointmentUpdate"
            EnableAdvancedForm="False"
            onappointmentdelete="rsEvents_AppointmentDelete" Localization-ConfirmDeleteTitle="Question"
            Localization-ConfirmDeleteText="Are you sure you want to cancel this event? You should send an email notiying them of the cancelation before continuing."
             
                onappointmentcontextmenuitemclicked="rsEvents_AppointmentContextMenuItemClicked"
                AllowInsert="False"
                StartEditingInAdvancedForm="False"
                ontimeslotcontextmenuitemclicked="rsEvents_TimeSlotContextMenuItemClicked">
            <AdvancedForm Modal="true" Enabled="False" />
             
<Localization ConfirmDeleteTitle="Question" ConfirmDeleteText="Are you sure you want to cancel this event? You should send an email notiying them of the cancelation before continuing."></Localization>
 
            <TimeSlotContextMenuSettings EnableDefault="true" />
                <AppointmentContextMenus>
                    <telerik:RadSchedulerContextMenu ID="RadSchedulerContextMenu1" runat="server">
                        <Items>
                            <telerik:RadMenuItem runat="server" Text="View" Value="View">
                            </telerik:RadMenuItem>
                            <telerik:RadMenuItem runat="server" Text="Delete" Value="CommandDelete">
                            </telerik:RadMenuItem>
                            <telerik:RadMenuItem runat="server" Text="Email" Value="Email">
                            </telerik:RadMenuItem>
                            <telerik:RadMenuItem runat="server" Text="Copy" Value="Copy">
                            </telerik:RadMenuItem>
                            <telerik:RadMenuItem runat="server" Text="Manage" Value="Manage">
                            </telerik:RadMenuItem>
                        </Items>
                    </telerik:RadSchedulerContextMenu>
                    <telerik:RadSchedulerContextMenu ID="RadSchedulerContextMenu2" runat="server">
                    </telerik:RadSchedulerContextMenu>
                </AppointmentContextMenus>
 
            </telerik:RadScheduler>
        </div>
    <br />
    <p>Templates</p>
    <asp:UpdatePanel ID="upTemplates" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
            <telerik:RadGrid ID="rgTemplates" runat="server" AllowSorting="True"
                    AutoGenerateColumns="False" DataSourceID="sqldsTemplates" GridLines="None"
                    Skin="Windows7" onitemcommand="rgTemplates_ItemCommand" AllowPaging="True">
                <MasterTableView DataKeyNames="EventID" DataSourceID="sqldsTemplates">
                <CommandItemSettings ExportToPdfText="Export to Pdf"></CommandItemSettings>
                    <Columns>
                        <telerik:GridBoundColumn DataField="EventID" DataType="System.Int32"
                            HeaderText="EventID" ReadOnly="True" SortExpression="EventID"
                            UniqueName="EventID" Visible="False">
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="EventName" HeaderText="EventName"
                            SortExpression="Event" UniqueName="EventName">
                            <HeaderStyle Width="100%" />
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="Seats" DataType="System.Int32"
                            HeaderText="Seats" SortExpression="# Seats" UniqueName="Seats">
                            <HeaderStyle Width="40px" />
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="Cost" DataFormatString="{0:$#,0.00}"
                            DataType="System.Decimal" HeaderText="Cost" SortExpression="Cost"
                            UniqueName="Cost">
                            <HeaderStyle Width="60px" />
                        </telerik:GridBoundColumn>
                        <telerik:GridButtonColumn CommandName="Delete" Text="Delete"
                            UniqueName="colDelete"
                            ConfirmText="Are you sure you want to cancel this event? You should send an email notiying them of the cancelation before continuing."
                            ConfirmTitle="Question">
                            <ItemStyle Font-Size="7pt" />
                        </telerik:GridButtonColumn>
                        <telerik:GridButtonColumn CommandName="Copy" Text="Copy"
                            UniqueName="colCopy">
                            <ItemStyle Font-Size="7pt" />
                        </telerik:GridButtonColumn>
                        <telerik:GridButtonColumn CommandName="Manage" Text="Manage"
                            UniqueName="colManage">
                            <ItemStyle Font-Size="7pt" />
                        </telerik:GridButtonColumn>
                    </Columns>
                </MasterTableView>
            </telerik:RadGrid>  
        </ContentTemplate>
        </asp:UpdatePanel>
    <br />
    <p>Past Events <span id="pastEvtCalBtn" class="viewCalender">(View Calendar)</span></p>
                <telerik:RadGrid ID="rgPastEvents" runat="server" AllowSorting="True"
                    AutoGenerateColumns="False" DataSourceID="sqldsPastEvents" GridLines="None"
                    Skin="Windows7" onitemcommand="rgPastEvents_ItemCommand" AllowPaging="True">
                <MasterTableView DataKeyNames="EventID" DataSourceID="sqldsPastEvents">
                <CommandItemSettings ExportToPdfText="Export to Pdf"></CommandItemSettings>
                    <Columns>
                        <telerik:GridBoundColumn DataField="EventID" DataType="System.Int32"
                            HeaderText="EventID" ReadOnly="True" SortExpression="EventID"
                            UniqueName="EventID" Visible="False">
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="StartDT" DataFormatString="{0:MM-dd-yyyy}"
                            DataType="System.DateTime" HeaderText="StartDT" SortExpression="Date"
                            UniqueName="StartDT">
                            <HeaderStyle Width="60px" />
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="EventName" HeaderText="EventName"
                            SortExpression="Event" UniqueName="EventName">
                            <HeaderStyle Width="100%" />
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="Seats" DataType="System.Int32"
                            HeaderText="Seats" SortExpression="# Seats" UniqueName="Seats">
                            <HeaderStyle Width="40px" />
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="SeatsLeft" DataType="System.Int32"
                            HeaderText="SeatsLeft" ReadOnly="True" SortExpression="# Left"
                            UniqueName="SeatsLeft">
                            <HeaderStyle Width="40px" />
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="Cost" DataFormatString="{0:$#,0.00}"
                            DataType="System.Decimal" HeaderText="Cost" SortExpression="Cost"
                            UniqueName="Cost">
                            <HeaderStyle Width="60px" />
                        </telerik:GridBoundColumn>
                        <telerik:GridHyperLinkColumn AllowFiltering="False" Groupable="False"
                            Reorderable="False" Resizable="False" ShowSortIcon="False" Target="_blank"
                            Text="View" UniqueName="colView" DataNavigateUrlFields="EventID"
                            DataNavigateUrlFormatString="../../events.aspx?id={0}">
                            <ItemStyle Font-Size="7pt" />
                        </telerik:GridHyperLinkColumn>
                        <telerik:GridButtonColumn CommandName="Delete" Text="Delete"
                            UniqueName="colDelete"
                            ConfirmText="Are you sure you want to cancel this event? You should send an email notiying them of the cancelation before continuing."
                            ConfirmTitle="Question">
                            <ItemStyle Font-Size="7pt" />
                        </telerik:GridButtonColumn>
                        <telerik:GridButtonColumn CommandName="Email" Text="Email"
                            UniqueName="colEmail">
                            <ItemStyle Font-Size="7pt" />
                        </telerik:GridButtonColumn>
                        <telerik:GridButtonColumn CommandName="Copy" Text="Copy"
                            UniqueName="colCopy">
                            <ItemStyle Font-Size="7pt" />
                        </telerik:GridButtonColumn>
                        <telerik:GridButtonColumn CommandName="Manage" Text="Manage"
                            UniqueName="colManage">
                            <ItemStyle Font-Size="7pt" />
                        </telerik:GridButtonColumn>
                    </Columns>
                </MasterTableView>
            </telerik:RadGrid>  
    <div id="schedPastEvents" style="display: block">
            <telerik:RadScheduler runat="server" ID="rsPastEvents" Height="580px" Width="100%"
                SelectedView="MonthView" ShowViewTabs="False"
            ShowNavigationPane="True" DataEndField="EndDT" DataKeyField="EventID"
            DataSourceID="sqldsPastEvents" DataStartField="StartDT"
            DataSubjectField="EventName" Skin="Windows7"
            onappointmentupdate="rsPastEvents_AppointmentUpdate"
            EnableAdvancedForm="False"
            onappointmentdelete="rsPastEvents_AppointmentDelete" Localization-ConfirmDeleteTitle="Question"
            Localization-ConfirmDeleteText="Are you sure you want to cancel this event? You should send an email notiying them of the cancelation before continuing."
             
                onappointmentcontextmenuitemclicked="rsPastEvents_AppointmentContextMenuItemClicked"
                AllowInsert="False"
                StartEditingInAdvancedForm="False"
                ontimeslotcontextmenuitemclicked="rsPastEvents_TimeSlotContextMenuItemClicked">
            <AdvancedForm Modal="true" Enabled="False" />
             
<Localization ConfirmDeleteTitle="Question" ConfirmDeleteText="Are you sure you want to cancel this event? You should send an email notiying them of the cancelation before continuing."></Localization>
 
            <TimeSlotContextMenuSettings EnableDefault="true" />
                <AppointmentContextMenus>
                    <telerik:RadSchedulerContextMenu ID="RadSchedulerContextMenu3" runat="server">
                        <Items>
                            <telerik:RadMenuItem runat="server" Text="View" Value="View">
                            </telerik:RadMenuItem>
                            <telerik:RadMenuItem runat="server" Text="Delete" Value="CommandDelete">
                            </telerik:RadMenuItem>
                            <telerik:RadMenuItem runat="server" Text="Email" Value="Email">
                            </telerik:RadMenuItem>
                            <telerik:RadMenuItem runat="server" Text="Copy" Value="Copy">
                            </telerik:RadMenuItem>
                            <telerik:RadMenuItem runat="server" Text="Manage" Value="Manage">
                            </telerik:RadMenuItem>
                        </Items>
                    </telerik:RadSchedulerContextMenu>
                    <telerik:RadSchedulerContextMenu ID="RadSchedulerContextMenu4" runat="server">
                    </telerik:RadSchedulerContextMenu>
                </AppointmentContextMenus>
 
            </telerik:RadScheduler>
        </div>
 
    </div>
</div>

1 Answer, 1 is accepted

Sort by
0
Peter
Telerik team
answered on 27 Aug 2010, 02:53 PM
Hello Scott,

We tested your code (after some modification like removing the grids since we don't have the data sources and binding RadScheduler with XmlSchedulerProvider) but the problem didn't show up at our side. We were able to drag appointments after showing RadScheduler. Can you please open a support ticket and send us a simple working demo of the issue?


Regards,
Peter
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Tags
Scheduler
Asked by
Scott
Top achievements
Rank 1
Answers by
Peter
Telerik team
Share this question
or