Error when moving appointment with image

4 posts, 1 answers
  1. Datamex
    Datamex avatar
    161 posts
    Member since:
    Jun 2012

    Posted 19 Aug 2009 Link to this post

    Hi,

    We found another problem in the scheduler control.
    For you information: We are using webservices with the advanced form.

    We are showing images in the appointments on the schedular, like on the following image:
    http://bart.nimio.info/images/fora/scheduler3.JPG

    But when i tried to move an appointment by clicking on the image, nothing happens until i release the mouse button.
    Then the appointment is stuck to the mouse pointer, after that i can't put the appointment back to the original place without updating the appointment or i can't put the appointment back to the scheduler at all. After that i am getting a lot of javascript errors when trying to move another appointment.

    We are using the following code to enable images on the appointment:

    /// <summary> 
          /// Occurs when a timeslot is created.  
          /// Sets the AppointmentType image, as well as the AppointmentState catagory color.  
          /// </summary> 
          /// <param name="sender">telerik:RadScheduler</param> 
          /// <param name="e">telerik:TimeSlot</param> 
          /// <returns>null</returns> 
          function TimeSlotCreated(sender, e) {  
            var app = e.get_appointment();  
            var element = e.get_appointment().get_element();  
            var attributeCollection = app.get_attributes();  
            var StateIconName = attributeCollection.getAttribute("StateIconName");  
            var SubStateIconName = attributeCollection.getAttribute("SubStateIconName");  
            var RsCategory = RgbStringToRadStyleString(attributeCollection.getAttribute("Color"));  
            var customerName = attributeCollection.getAttribute("CustomerName");  
            var startTime = app.get_start().format("MMM dd, yyyy HH:mm:ss");  
            attributeCollection.setAttribute("OriginalStartTime", startTime);  
     
            // Set the tooltip of the appointment  
            if (customerName == null) { customerName = "Geen klant"; }  
            app.set_toolTip("Afspraak: " + app.get_toolTip() + "\n" + "Klant:       " + customerName);  
     
            // Set the stateimage  
            var image = document.createElement("img");  
            image.setAttribute("src", '<%= System.Configuration.ConfigurationManager.AppSettings["IconDirectory"].Replace("~","") %>' + StateIconName);  
            image.setAttribute("alt", 'IconImage');  
     
            // If the appointment has a substate then show the substateimage  
            if (SubStateIconName != null) {  
              var image2 = document.createElement("img");  
              image2.setAttribute("src", '<%= System.Configuration.ConfigurationManager.AppSettings["IconDirectory"].Replace("~","") %>' + SubStateIconName);  
              image2.setAttribute("alt", 'IconImage');  
            }  
     
            element.setAttribute("class", element.className + " rsCategory" + RsCategory);  
     
            // All appointments with ID 0 are script generated, they are not actually appointments within the database, thus must not be allowed to  
            // be edited/moved or resized in any way shape or form.  
            if (app.get_id() == 0) {  
              app.set_allowDelete(false);  
              app.set_allowEdit(false);  
            }  
     
            var divs = element.getElementsByTagName('div');  
            var result;  
            var innerHTML;  
            for (i = 0; i < divs.length; i++) {  
              // IE and its eternal spacing issues *sigh*  
              if ($telerik.$(divs[i]).is("div.rsAptContent")) {  
                result = divs[i];  
                innerHTML = result.innerHTML;  
                result.innerHTML = '';  
                result.appendChild(image);  
     
                // If the appointment has a substate then show the substateimage  
                if (SubStateIconName != null) { result.appendChild(image2); }  
     
                result.innerHTML = result.innerHTML + innerHTML;  
                result.innerHTML = result.innerHTML + "<br />";  
     
                if (customerName != "Geen klant") {  
                  result.innerHTML = result.innerHTML + customerName;  
                }  
                return;  
              }  
            }  
     
          } 

    Is this a bug and is there a fix or workaround for this problem?
  2. Datamex
    Datamex avatar
    161 posts
    Member since:
    Jun 2012

    Posted 19 Aug 2009 Link to this post

    Hi,

    I made a video of the problem:

    http://webstaal.datamex.nl/test/2009-08-19_1002.swf

    You can see that the first time i can move the appointment without a problem.
    But when i move the appointment by clicking on the image, the appointment get stuck on the mouse pointer.
    After that i can't move any appointments anymore and i'm getting a lot of javascript errors.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Answer
    Peter
    Admin
    Peter avatar
    6637 posts

    Posted 19 Aug 2009 Link to this post

    Hi Datamex,

    This is a common problem when using images in AppointmentTemplate. Here is a workaround:
     <AppointmentTemplate> 
                <asp:Image ID="image1" runat="server" ondragstart="javascript:return false;" src="flag.jpg" /> 
            </AppointmentTemplate> 


    Best wishes,
    Peter
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  5. Datamex
    Datamex avatar
    161 posts
    Member since:
    Jun 2012

    Posted 20 Aug 2009 Link to this post

    Thanks peter Its working!!
Back to Top