Moving Multiple Appointments

5 posts, 0 answers
  1. Michael
    Michael avatar
    43 posts
    Member since:
    Mar 2013

    Posted 24 Oct 2013 Link to this post

    Hello!

    I have written the following javascript function that selects all the appointments of a certain "group". Now I wish to move them all to the left and right the exact same amount....any thoughts.

    function OnClientAppointmentMoving(sender, args)
            {
                //Get all appointments and info
                var appointments = sender.get_appointments();
                var appointmentcount = appointments.get_count();
                //Get selected appointment and its info
                var currentappointment = args.get_appointment();
                var oldslot = currentappointment.get_timeSlot();
                var list = currentappointment.get_attributes();
                var ordergroup = list.getAttribute("OrderGroup");
                //Selected appointment drop slot
                var newslot = args.get_targetSlot();
                var curslot = newslot - oldslot;
                alert(oldslot);
                //handle all visiable appointments
                for (var i = 0; i < appointmentcount; i++)
                {
                    //Get all scheduler appointments
                    appointment = appointments.getAppointment(i);
                    appointment.set_selected(false);
                    templist = appointment.get_attributes();
                    tempordergroup = templist.getAttribute("OrderGroup");
                    //Work only with current appointment group
                    if (tempordergroup == ordergroup)
                    {
                        //Visually demonstrate split is selected
                        appointment.set_selected(true);
                        //Move all selected appointments left and right by same amount
                        //HELP HERE!!!
     
                    }//end if
                }//end for
     
                 
     
            }//end function

    Thanks in advance!
  2. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    1746 posts

    Posted 29 Oct 2013 Link to this post

    Hello,

    Unfortunately such functionality is not supported by the RadScheduler control - only one appointment could be moved or re-sized at a time.

    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.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Michael
    Michael avatar
    43 posts
    Member since:
    Mar 2013

    Posted 29 Oct 2013 Link to this post

    I was able to achieve the interaction I wanted using javascript. I have attached javascript I used for anyone needing the same effect. Here is the JS below in action. Video Capture

    //Global Variables
    var beginTop = -1;
    var beginLeft = -1;
     
    //Appointment Functions
    function selectAppointment(appointment)
    {
        //appointment.set_selected(true);
        domObject = appointment.get_element();//get current appointment DOM object
        domObjectID = domObject.getAttribute("ID");//get current DOM object ID
        $('#' + domObjectID).addClass("grouped");
        $('#' + domObjectID).addClass("rsAptSelected");
    }//end function
     
    function deselectAppointment(appointment)
    {
        domObject = appointment.get_element();//get current appointment DOM object
        domObjectID = domObject.getAttribute("ID");//get current DOM object ID
        $('#' + domObjectID).removeClass("grouped");//Enable Grouping on the DOM element
        $('#' + domObjectID).removeClass("rsAptSelected");//Enable Grouping on the DOM element
    }//end function
     
    function getAppointmentOffset(appointment)
    {
        domObject = appointment.get_element();//get current appointment DOM object
        domObjectID = domObject.getAttribute("ID");//get current DOM object ID
        var offset = $('#' + domObjectID).offset();
        return offset;
         
    }//end function
     
    //Gantt Chart Events
     
    function OnClientAppointmentClick(sender, args)
    {
        var appointment;
        var appointmentid;
        var thisList;
        var thisOrderGroup;
        var thisAppointmentID;
        var domObject;
        var domObjectID;
        var appointments = sender.get_appointments();
        var appointmentcount = appointments.get_count();
        var curAppointment = args.get_appointment();
        var curAppointmentID = curAppointment.get_id();
        var list = curAppointment.get_attributes();
        var orderGroup = list.getAttribute("OrderGroup");
        var eventType = list.getAttribute("EventType");
        //Test for machine down
        if (eventType == "3")
        {
            return;
        }//end if
        for (var i = 0; i < appointmentcount; i++) {
            appointment = appointments.getAppointment(i);
            thisList = appointment.get_attributes();
            thisAppointmentID = appointment.get_id();
            thisOrderGroup = thisList.getAttribute("OrderGroup");
            deselectAppointment(appointment);//Reset Selected Appointments
            //Set selected for group
            if (thisOrderGroup == orderGroup)
            {
                selectAppointment(appointment);
            }//end if
        }//end for
    }//end function
     
    function OnClientTimeSlotClick(sender, args)
    {
        var appointments = sender.get_appointments();
        var appointmentcount = appointments.get_count();
        var appointment;
        for (var i = 0; i < appointmentcount; i++)
        {
            appointment = appointments.getAppointment(i);
            deselectAppointment(appointment);
        }
    }//end function
     
    function OnClientAppointmentMoveStart(sender, args)
    {
        //Get all appointments and info
        var appointments = sender.get_appointments();
        var appointmentCount = appointments.get_count();
        //Get selected appointment and its info
        var curAppointment = args.get_appointment();
        var list = curAppointment.get_attributes();
        var curOrderGroup = list.getAttribute("OrderGroup");
        var curAppointmentID = curAppointment.get_id();
        var offset = getAppointmentOffset(curAppointment);
        beginTop = offset.top;
        beginLeft = offset.left;
        //handle all visiable appointments
        for (var i = 0; i < appointmentCount; i++)
        {
            //Get all scheduler appointments
            var appointment = appointments.getAppointment(i);
            var thisList = appointment.get_attributes();
            var thisOrderGroup= thisList.getAttribute("OrderGroup");
            var thisAppointmentID=appointment.get_id();
            if (thisAppointmentID != curAppointmentID)
            {
                deselectAppointment(appointment);
            }
            //Work only with current appointment group
            if (thisOrderGroup == curOrderGroup && thisAppointmentID!=curAppointmentID)
            {
                selectAppointment(appointment);
            }//end if
        }//end for
     
    }//end function
     
    function OnClientAppointmentMoving(sender, args)
    {
        //Get the current appointment offset
        var curAppointment=args.get_appointment();
        var curOffset=getAppointmentOffset(curAppointment);
        var moveTop = beginTop - curOffset.top;
        var moveLeft = beginLeft - curOffset.left;
        beginTop = curOffset.top;
        beginLeft = curOffset.left;
        //get all of group
        $('.grouped').each
        (
            function (i)
            {
                var thisOffset = $(this).offset();
                var thisLeft = thisOffset.left - moveLeft;
                var thisTop = thisOffset.top - moveTop;
                $(this).offset({left: thisLeft });
            }
        );//end each
     
    }//end function
     
    function OnClientAppointmentMoveEnd(sender, args)
    {
        var curAppointment = args.get_appointment();
        sender.updateAppointment(curAppointment);
    }//end function
  5. En
    En avatar
    15 posts
    Member since:
    Nov 2011

    Posted 29 Oct 2013 Link to this post

    Hello Boyan,
    Can you see my case in http://www.telerik.com/community/forums/aspnet-ajax/scheduler/can-i-localize-the-hours-column-to-another.aspx#2849112 ???
    Thank you so much
  6. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 01 Nov 2013 Link to this post

    Hi En,

    I have just answered your question in the forum post. Please take a look at it.

    Regards,
    Kate
    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.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017