RadScheduler - drag and drop

[Mehmet]

hi,

I am trying to extract the info of an attribute once the drop action is done.

I tried doing "var selectedStaffID = scheduler.getAppointmentFromDomElement(htmlElement).get_attributes("StaffID");"
However, that didn't help me.
How can i get the data of the scheduler's attribute on a spot where the appointment is dropped ?
thank you

01.function rowDropping(sender, eventArgs) {
02.                    // Fired when the user drops a grid row
03.                    var htmlElement = eventArgs.get_destinationHtmlElement();
04.                    var scheduler = $find('<%= RadScheduler2.ClientID %>');
05.
06.                    if (isPartOfSchedulerAppointmentArea(htmlElement)) {
07.
08.                        // The row was dropped over the scheduler appointment area
09.                        // Find the exact time slot and save its unique index in the hidden field
10.                        var timeSlot;
11.                        //var selectedStaffID = scheduler.getAppointmentFromDomElement(htmlElement).get_attributes("StaffID");
12.                        //alert(selectedStaffID);
13.                        if ($telerik.$(htmlElement).parents(".rsApt").length != 0)
14.                            timeSlot = scheduler.getAppointmentFromDomElement(htmlElement).get_timeSlot();
15.                        else
16.                            timeSlot = scheduler._activeModel.getTimeSlotFromDomElement(htmlElement);
17.                        $get("<%=TargetSlotHiddenField.ClientID %>").value = timeSlot.get_index();
18.
19.                        // The HTML needs to be set in order for the postback to execute normally
20.                        eventArgs.set_destinationHtmlElement("<%=TargetSlotHiddenField.ClientID %>");
21.                    }
22.                    else {
23.
24.                        // The node was dropped elsewhere on the document
25.                        eventArgs.set_cancel(true);
26.                    }
27.                }

[Plamen]

Hello Mehmet,

In such scenarios we recommend using .get_attributes().getAttribute("StaffID") as it is documented in this help topic.

Hope this will help you solve the issue.

Regards,
Plamen
Telerik

 

 

[Mehmet]

Hi Plamen,

No luck.

timeSlot = scheduler._activeModel.getTimeSlotFromDomElement(htmlElement);
                           var selectedStaff = scheduler.get_attributes().getAttribute("StaffID");
                            alert(selectedStaff);

selectedStaff comes up "undefined"..  
what else could I try ?
thank you

[Plamen]

Hi Mehmet,

It looks like there is some kind of misunderstanding. 

TimeSlot objects do not have attributes and only the appointments do so the result you are getting is expected. You can refer to this help topic where more information about the timeslot client object is provided.

Regards,
Plamen
Telerik

 

 

[Mehmet]

Hi,

Yes, true. However, my scheduler is grouped by the staff list and once I drag the appointment and drop it onto scheduler, I am taking the date-time and I have to retrieve the information of which staff that I drop the appointment on. I am working on the example that you have given me which is :

var resource = null;
if (timeSlot.get_resource)
resource = timeSlot.get_resource();

I dont know how to receive the staff that I drop the appointment on it as the scheduler is grouped by the staff list. Staff List is described as a resource for the scheduler. Hope I could have explained better. 

I have attached a screenshot where you can see that I drag the appointment from the bottom grid and drop on to the scheduler above. Once I drop it I have to know what date - time (which I know) and which staff that I allocate for as you can see the staff name on the left hand side.
Appreciate your time and help..

[Plamen]

Hello Mehmet,

In a scenario when RadScheduler is GroupedBy resource you can get the resource of the timeslot client object as in the code that you shared (get_resource)and here below if how you can get the text, key and type of this resource:

timeSlot.get_resource().get_text();
timeSlot.get_resource().get_type();
timeSlot.get_resource().get_key();

Hope this information will help you solve the issue.

Regards,
Plamen
Telerik

 

 

[asanka]

Hi,

I have a small problem drag and drop resources in to all day appointments. Since that facility not enable on All day area.But it's working fine in other calendar area.How can I overcome this issue?I'm using CustomScheduleViewDragDropBehavior  inside DragDropBehavior ,

<telerik:RadScheduleView.DragDropBehavior>
                                    <moduleCalendar:CustomScheduleViewDragDropBehavior />
                                </telerik:RadScheduleView.DragDropBehavior>
                                <telerik:RadScheduleView.ViewDefinitions><telerik:RadScheduleView.DragDropBehavior>.

Thanks

[Nasko]

Hello Asanka,

From the provided description of your scenario we assume your question is about WPF or Silverlight's RadSheduleView. If that is the case currently it is not possible to drag or drop Appointments inside the AllDay area of RadScheduleView. 

However, if this information does not answer completely your question we suggest you to post it either to the WPF or Silverlight forum. We will also need some more detailed information about the desired by you functionality and the behavior you are currently observing. Thus we could be able to provide you with a proper solution if possible.

Hopes this helps.

Regards,
Nasko
Telerik

[asanka]

Hi Nasko,

Thank you very much for your reply.Yes.My Question is about Silverlight's RadSheduleView. Actually I'm not drag and drop appointments in to all day area.What I'm doing is drag and drop other resources (People,Locations etc.) in to one of the appointment in all day area.For this I'm using telerik:RadScheduleView.DragDropBehavior as I mentioned above and it's not enable for all day area appointments.But It's working fine normal appointments.Is there any different way to activate that facility?

Here with attached the fully details of my RadSheduleView code.

 

     <telerik:RadScheduleView           
            SnapAppointments="True"
            Name="radScheduleDetails"
            NavigationHeaderVisibility="Collapsed"  
            SelectedSlot="{Binding SelectedSlot,Mode=TwoWay}"
            ActiveViewDefinitionIndex="{Binding ActiveViewDefinitionIndex,Mode=TwoWay}"  
            DragVisualTemplate="{StaticResource DragVisualContentTemplate}"
            DragDropHighlightStyle="{StaticResource CustomDragDropHighlightStyle}"
            EditAppointmentDialogStyle="{StaticResource CustomEditAppointmentDialogStyle}"           
            Grid.Column="1" MouseRightButtonUp="RadScheduleDetails_OnMouseRightButtonUp"
            Grid.Row="0" MinAppointmentWidth="1"
            Grid.RowSpan="2"     
            VisibleRangeChanged="radScheduleDetails_VisibleRangeChanged"
            ToolTipTemplate="{StaticResource AppointmentToolTipTemplate}"
            AppointmentsSource="{Binding Appointments,Mode=TwoWay}"                
            SelectedAppointment="{Binding SelectedAppointment, Mode=TwoWay}"
            AppointmentSelectionChanged="radScheduleDetails_AppointmentSelectionChanged"
            AppointmentItemContentTemplate="{StaticResource templateCalAppointment}"
            ShowDialog="RadScheduleDetails_OnShowDialog"              
            DialogClosing="RadScheduleDetails_OnDialogClosing"
            AppointmentEdited="RadScheduleView_AppointmentEdited"
            GroupDescriptionsSource="{Binding GroupDescriptions,Mode=TwoWay}"
            ResourceTypesSource="{Binding ResourceTypes,Mode=TwoWay}"
            VisibleRangeChangedCommand="{Binding VisibleDateRangeChanged}"
            VisibleRangeChangedCommandParameter="{Binding VisibleRange,RelativeSource={RelativeSource Self}}"
            CurrentDate="{Binding ViewCurrentDate,Mode=TwoWay}"                         
            SpecialSlotsSource="{Binding WorkingHours}"                
            TimeRulerItemStyleSelector="{StaticResource TimeRulerItemStyleSelector}"      
            ShowCurrentTimeIndicator="True"                 
            MinTimeRulerExtent="600" MaxTimeRulerExtent="10000"    ShowAppointmentDeleteButton="False"             
            AppointmentEditing="radScheduleDetails_AppointmentEditing"
                AppointmentStyleSelector="{StaticResource AppointmentItemStyleSelector}">

                                <telerik:RadScheduleView.DragDropBehavior>
                                    <moduleCalendar:CustomScheduleViewDragDropBehavior />
                                </telerik:RadScheduleView.DragDropBehavior>
                                <telerik:RadScheduleView.ViewDefinitions>

                                    <telerik:DayViewDefinition
                        x:Name="DayViewDefination" TimerulerMajorTickStringFormat="{}{0:HH}:{0:mm}"
                                               EnableSmallAppointmentRendering="True"                                        
                                               ShowWeekGroupHeaders="False"                                             
                                               GroupFilter="{Binding GroupFilter,Mode=TwoWay}"                       
                                               MinTimeRulerExtent="1600"         
                                               MaxTimeRulerExtent="1600"                                                 
                                               MajorTickLength="1h"
                                               MinorTickLength="30min"      
                                               ShowTimeRuler="True"   
                                               ShowAllDayArea="True"
                        />



                                    <telerik:WeekViewDefinition ShowWeekGroupHeaders="False"      TimerulerMajorTickStringFormat="{}{0:HH}:{0:mm}"                                          
                                             WeekGroupHeaderStringFormat="Week {0} ,{1:D}"    
                                             MinorTickLength="30min"
                                             MajorTickLength="1h"
                                             GroupFilter="{Binding GroupFilter}"  MinTimeRulerExtent="1600"  MaxTimeRulerExtent="1600"  ShowAllDayArea="True"  />

                                    <telerik:MonthViewDefinition CalendarWeekRule="FirstFullWeek"  FirstDayOfWeek="Monday"
                                                 GroupFilter="{Binding GroupFilter,Mode=TwoWay}" />

                                    <telerik:TimelineViewDefinition GroupFilter="{Binding GroupFilter}"
                                                    TimerulerMajorTickStringFormat="{}{0:HH:mm}"
                                                                MajorTickLength="1day"
                                                                MinorTickLength="1day"
                                                                TimerulerGroupStringFormat="{}{0:dd ddd}"
                                                     MinTimeRulerExtent="1"   />

                                    <telerik:WeekViewDefinition Title="Multi Days"
                                            GroupFilter="{Binding SelectedDateFilter}" FirstDayOfWeek="{Binding FirstDayOfWeek}" VisibleDays="{Binding VisibleDays}"
                                                 MinTimeRulerExtent="1600"         
                                               MaxTimeRulerExtent="1600"                                                
                                               MajorTickLength="1h"
                                               MinorTickLength="30min"      
                                               ShowTimeRuler="True"    
                                                GroupHeaderDateStringFormat="{}{0:dddd(dd/MM/yyyy)}"
                                               ShowAllDayArea="True"  />

                                </telerik:RadScheduleView.ViewDefinitions>

                    <telerik:RadContextMenu.ContextMenu>
                        <telerik:RadContextMenu x:Name="RadContextMenu" IsEnabled="{Binding IsContextMenuEnable}" >

                            <telerik:RadMenuItem Name="copyContextmenuitem" Header="{Binding LocalizedStrings.CAL_RIGHT_CLICK_COPY,
                                                Source={StaticResource myCustomResources}}"
                                         Command="{Binding DC[AppointmentCopyCommand],Mode=TwoWay }"
                                         CommandParameter="{Binding Menu.UIElement.SelectedAppointments, RelativeSource={RelativeSource Self}}"
                                         Visibility="{Binding Header, RelativeSource={RelativeSource Self}, Converter={StaticResource NullToVisibilityConverter}}"/>

                                        <telerik:RadMenuItem Name="linkContextmenuitem" Header="{Binding LinkHeader,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
                                         Command="{Binding DC[AppointmentLinkCommand],Mode=TwoWay}"                                                 
                                         Visibility="{Binding Header, RelativeSource={RelativeSource Self}, Converter={StaticResource NullToVisibilityConverter}}"/>
                                    </telerik:RadContextMenu>
                                </telerik:RadContextMenu.ContextMenu>

                            </telerik:RadScheduleView>​

 

 Thanks

 

 

[Nasko]

Hello Asanka,

The desired by you functionality is currently not supporter by RadScheduleView. As I have already explained in my previous response I am afraid that dragging not only of appointments but of any other UIElement inside the AllDayArea is currently not supported.

You can log this as a feature request in our Feedback Portal where we could get some feedback about this feature and evaluate it.

We apologize for any caused inconvenience.

Regards,
Nasko
Telerik

[Keith Jusas]

Hello Plamen

I'm also having the same issue i tired the things you said but my drag drop functionality doesn't work anymore. This is the javascirpt my trying . Can you please help me out what i'm doing wrong ?

 

if (isPartOfSchedulerAppointmentArea(htmlElement)) {
    // The row was dropped over the scheduler appointment area
    // Find the exact time slot and save its unique index in the hidden field
    var timeSlot;
              if ($telerik.$(htmlElement).parents(".rsApt").length != 0)
        timeSlot = Scheduler.scheduler.getAppointmentFromDomElement(htmlElement).get_timeSlot();
    else
        timeSlot = Scheduler.scheduler._activeModel.getTimeSlotFromDomElement(htmlElement);

              $get(Scheduler.targetSlotHiddenFieldId).value = timeSlot.get_index();
              var resource = null;
              if (timeSlot.get_resource)
                  resource = timeSlot.get_resource().get_Key();
              $get(Scheduler.ResourceNameHiddenFieldID).value = resource;
    // The HTML needs to be set in order for the postback to execute normally
    eventArgs.set_destinationHtmlElement(Scheduler.targetSlotHiddenFieldId);

}

[Vessy]

Hi Keith,

We have already answered your support ticket on the matter, for both sides convenience I will advice that we continue our conversation there.

To whom it may concerns - a live demo on how to drag and drop rows from RadGrid to RadScheduler for ASP.NET AJAX can be found here:
http://demos.telerik.com/aspnet-ajax/scheduler/examples/draganddropintegration/defaultcs.aspx?product=scheduler


Regards,
Vessy
Telerik by Progress