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

Add Edit icon in appointments

5 Answers 84 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
Dayanithy
Top achievements
Rank 1
Dayanithy asked on 20 Nov 2013, 10:42 PM
Hi,

I am using RadScheduler - version 2013.3.1015.35.

Is it possible to add an edit icon next to the delete icon in the appointment? I have attached the screenshot of how i wanted the screen to be. I am using only the month view.

The edit button should be visible only when you mouse hover the appointment(Similar to delete).

Any help is greatly appreciated.

Thanks,
Dayanithy

5 Answers, 1 is accepted

Sort by
0
Boyan Dimitrov
Telerik team
answered on 25 Nov 2013, 05:08 PM
Hello Dayanithy,

An easy and convenient way of achieving such functionality would be to use the appointment templates. This way you are able add custom elements/controls to your appointment container.  Pleas refer to this demo for more information. The <AppointmentTemplate> section contains all controls you want to place in the appointment container.

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
Dayanithy
Top achievements
Rank 1
answered on 26 Nov 2013, 03:12 PM
Thanks Boyan.

How can we achieve the mouse hover functionality for the custom controls in the appointment template, similar to DELETE icon/control?

Thanks
Dayanithy
0
Accepted
Boyan Dimitrov
Telerik team
answered on 29 Nov 2013, 03:59 PM
Hello Dayanithy,

An easy and convenient way of achieving such functionality is shown in the code snippet below:
//markup code
<telerik:RadScheduler ID="RadScheduler1" runat="server" >
    <AppointmentTemplate>
        <a class="CustomClass">
            <img src="your image name.png" />
        </a>
    </AppointmentTemplate>
</telerik:RadScheduler>
//css
.CustomClass {
    visibility: hidden  ;
}
//JavaScript
function pageLoad() {
    $telerik.$(".rsAptContent").hover(function () {
        $telerik.$(".CustomClass").css("visibility", "visible");
    }, function () {
        $telerik.$(".CustomClass").css("visibility", "hidden")
    });
}


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
Dayanithy
Top achievements
Rank 1
answered on 29 Nov 2013, 05:02 PM
Thank you  Boyan.
0
Shoikan
Top achievements
Rank 1
answered on 25 Apr 2017, 11:44 AM

Hello Boyan, I'm implementing the same functionality as Dayanithy, and while your solution works fine, it shows and hides the button of all of the appointments at once instead of showing the button of the current appointment being hovered.

Is there a solution for this behaviour?

Thanks in advance.

Tags
Scheduler
Asked by
Dayanithy
Top achievements
Rank 1
Answers by
Boyan Dimitrov
Telerik team
Dayanithy
Top achievements
Rank 1
Shoikan
Top achievements
Rank 1
Share this question
or