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

Post back on scheduler web service binding

3 Answers 97 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
Meera
Top achievements
Rank 1
Meera asked on 06 Jan 2014, 04:01 AM
Hi,

I have a rad scheduler to show appointments and i have recently modified it to use web service binding. I have few client side events on it and one of it is OnClientAppointmentClick. When i click on an appointment, i want a new rad panel to show up adjacent to the scheduler. For this i use a dummy button to post back on the OnClientAppointmentClick event. The issue is that after modifying  the scheduler to web service binding, the OnClientAppointmentClick event seems to take for ever to load and it is affecting the performance. I am not sure if this is caused because post back is causing a conflict to the web service or not.

<telerik:RadScheduler runat="server"  ID="rsTicketsSchedule"
                                    OnResourcesPopulating="rsTicketsSchedule_ResourcesPopulating"
                                    SelectedView="TimelineView"
                                    OnTimeSlotCreated="rsTicketsSchedule_TimeSlotCreated"
                                    OnClientAppointmentsPopulated="OnClientAppointmentsPopulated"
                                          OnClientAppointmentsPopulating="OnClientAppointmentsPopulating"
                                    OnClientResourcesPopulating="OnClientResourcesPopulating"
                                    AppointmentStyleMode="Default"
                                    OnClientAppointmentClick="singleClick"
                                    OnClientAppointmentCreated="OnAppointmentCreated"
                                    OnClientAppointmentDoubleClick="rsClientAppointmentDoubleClick"
                                    OnClientAppointmentMoveEnd="AppointmentMoved"
                                    OnClientAppointmentResizeStart="OnAppointmentResizeStart"
                                    OnClientAppointmentResizeEnd="OnAppointmentResizeEnd"
                                    OnClientAppointmentWebServiceDeleting="OnAppointmentDeleting"
                                    OnClientAppointmentWebServiceUpdating="OnAppointmentUpdating"
                                    OnClientRequestSuccess="OnClientRequestSuccess"
                                    OnClientRequestFailed="OnClientRequestFailed"
                                    OnClientAppointmentMoveStart="StopTimer"
                                    OnClientAppointmentDataBound="OnClientAppointmentDataBound"
                                    OnClientDataBound="onSchedulerDataBound"
                                    AllowInsert ="False"
                                    DisplayDeleteConfirmation="True"
                                    Localization-HeaderToday="Today"
                                    EnableCustomAttributeEditing="True"
                                    EnableDescriptionField="True"
                                    Height="100%"
                                    EnableExactTimeRendering="true"
                                    EnableViewState="true"
                                    OverflowBehavior="Scroll"
                                    ShowAllDayRow ="false"  
                                    OnClientAppointmentContextMenu ="OnClientAppointmentContextMenu"
                                    OnClientAppointmentContextMenuItemClicked="handleClick"
                                    OnClientNavigationComplete = "OnClientNavigationComplete"
                                    OnClientNavigationCommand  = "OnClientNavigationCommand"
                                >
                                
                                <DayView UserSelectable="True" GroupBy="TechName" GroupingDirection="Horizontal" />
                                <WeekView UserSelectable="True" GroupBy="TechName" GroupingDirection="Vertical"  />
                                <MonthView UserSelectable="True" GroupBy="TechName" GroupingDirection="Vertical"  />
 
                                <TimelineView 
                                    GroupBy="TechName"
                                    ColumnHeaderDateFormat="h:mm tt"
                                    GroupingDirection="Vertical"
                                    HeaderDateFormat="MM/dd/yyyy h:mm tt"
                                    NumberOfSlots ="21" 
                                    SlotDuration="00:30:00"
                                    StartTime="08:00:00"  />
 
                                      <WebServiceSettings   Path="WorkforceServices/M4SchedulerWebService.asmx" ResourcePopulationMode="ServerSide" />
 
                                <AppointmentContextMenus >
                                    <telerik:RadSchedulerContextMenu ID="RsTicketsScheduleContextMenu" runat="server"   > </telerik:RadSchedulerContextMenu>
                                </AppointmentContextMenus>
 
                                <ResourceTypes>
                                    <telerik:ResourceType Name="TechName" />
                                    <telerik:ResourceType Name="TicketState" />
                                </ResourceTypes>
 
                      </telerik:RadScheduler>

This is the client side event I have the issue with:

OnClientAppointmentClick="singleClick"

function singleClick(sender, eventArgs) {
    var apptID1 = eventArgs.get_appointment().get_id();
    apptIDInfo = "ShowRadTabStrip|" + apptID1 + "|ApptID";
    __doPostBack("TestPanel1UpdBtn", apptIDInfo);  //Causes Postback to show RadTabstrip for TicketInfo
    return false;
}

Is there any way I can improve this?

Thanks,

Meera

3 Answers, 1 is accepted

Sort by
0
Boyan Dimitrov
Telerik team
answered on 08 Jan 2014, 02:45 PM
Hello,

I would like to clarify that full page post-back will create the RadScheduler control, request the appointments and populate the RadScheduler. This will happen each time when user clicks on an appointment. In this case I would suggest to initiate Ajax in order to update(show/hide) the RadTabStrip control. This will update only part of the page and the RadScheduler will not be affected at all. Please find attached a project that shows how you can set new text for the RadTabStrip tab if you click on an appointment without full page post-back.
//markup code
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadTabStrip1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
 
<telerik:RadTabStrip ID="RadTabStrip1" runat="server">
          <Tabs>
              <telerik:RadTab Text="Sample tab"></telerik:RadTab>
          </Tabs>
      </telerik:RadTabStrip>

//JavaScript
` function clientAppointmentClick(sender, args) {
            var ajaxManager = $find("<%= RadAjaxManager1.ClientID %>");        
            ajaxManager.ajaxRequest("new text");
        }
//code behind
protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e)
        {
            RadTabStrip1.Tabs[0].Text = e.Argument;
        }

Please refer to this help article for more information about the RadAjaxManager.

Regards,
Boyan Dimitrov
Telerik
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 the blog feed now.
0
Meera
Top achievements
Rank 1
answered on 08 Jan 2014, 04:03 PM
Thank you for your response.

I have modified my code according to your suggestions but the issue i am facing right now is that the tab does not show at all.
The scenario is that the scheduler take up the full space of the web page and when I click an appointment, I am re-sizing the scheduler so that the radTabStrip shows adjacent to the scheduler on left. In this case, i am assuming that i need to ajaxify the scheduler too ?

Something like:

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadTabStrip1" />
                        <telerik:AjaxUpdatedControl ControlID="SchedulerPanel1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>


When i do this, the situation becomes similar to a full post back. Is it possible to expand the rad tab without affecting the panel containing the scheduler?

Thanks,
Meera


0
Boyan Dimitrov
Telerik team
answered on 13 Jan 2014, 12:22 PM
Hello,

An easy and convenient way of achieving such functionality would be to wrap the RadScheduler control and the RadTabStrip in two div elements. When user clicks on an appointment you can change the width values of both div containers. in order both RadScheduler and the RadTabStrip to show next to each other on the page I would suggest using the css float properties for those containers.

Please note that when modifying the width value of the RadScheduler container element you should call the repaint method of the RadScheduler client-side object.



Regards,
Boyan Dimitrov
Telerik
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 the blog feed now.
Tags
Scheduler
Asked by
Meera
Top achievements
Rank 1
Answers by
Boyan Dimitrov
Telerik team
Meera
Top achievements
Rank 1
Share this question
or