How to highlight all visible appointments of the same resource when clicking on an appointment in RadScheduler
How to
Highlight all visible appointments of the same resource when clicking on an appointment.
Description
Appointments of various resources are displayed. Clicking on an appointment will highlight with custom color all appointments with the same resource. For this solution:
Assign a 'Color' attribute for the Resources in RadScheduler's DataBound event handler.
On OnClientAppointmentClick, access appointment's resources client-side and loop through all visible appointments of RadScheduler client-side.
Set the appointment backColor property client-side based on the resource attribute.
Finally, clear the backColor on timeslotclick or appointment click.
Solution
function OnClientAppointmentClick(sender, eventArgs) {
var clickedAppResource = eventArgs.get_appointment().get_resources().getResourceByType("User");
if (clickedAppResource != null) {
sender.get_appointments().forEach(function(app) {
app.set_backColor("");
var currentAppResource = app.get_resources().getResourceByType("User");
//create you condition based on custom attribute or resource
if ((currentAppResource != null) && (clickedAppResource.get_text() == currentAppResource.get_text()))
app.set_backColor(currentAppResource.get_attributes().getAttribute("Color"));
});
}
}
function OnClientTimeSlotClick(sender, eventArgs) {
sender.get_appointments().forEach(function(app) {
//clear the selected style:
app.set_backColor("");
});
}
Here you can store your choice of color in the resource attributes collection:
protected void RadScheduler1_DataBound(object sender, EventArgs e)
{
foreach (Resource res in RadScheduler1.Resources.GetResourcesByType("User"))
{
switch (res.Key.ToString())
{
case "1":
res.Attributes["Color"] = "green";
break;
case "2":
res.Attributes["Color"] = "red";
break;
case "3":
res.Attributes["Color"] = "blue";
break;
default: break;
}
}
}
Protected Sub RadScheduler1_DataBound(ByVal sender As Object, ByVal e As EventArgs) Handles RadScheduler1.DataBound
For Each res As Resource In RadScheduler1.Resources.GetResourcesByType("User")
Select Case res.Key.ToString()
Case "1"
res.Attributes("Color") = "green"
Exit Select
Case "2"
res.Attributes("Color") = "red"
Exit Select
Case "3"
res.Attributes("Color") = "blue"
Exit Select
Case Else
Exit Select
End Select
Next
End Sub