All docs
V21.2
21.2
21.1
20.2
The page you are viewing does not exist in version 20.2. This link will take you to the root page.
20.1
The page you are viewing does not exist in version 20.1. This link will take you to the root page.
19.2
The page you are viewing does not exist in version 19.2. This link will take you to the root page.
19.1
The page you are viewing does not exist in version 19.1. This link will take you to the root page.
18.2
The page you are viewing does not exist in version 18.2. This link will take you to the root page.
18.1
The page you are viewing does not exist in version 18.1. This link will take you to the root page.
17.2
The page you are viewing does not exist in version 17.2. This link will take you to the root page.

ASPxClientGantt.TaskShowing Event

Occurs before a task is displayed.

Declaration

TaskShowing: ASPxClientEvent<ASPxClientGanttTaskShowingEventHandler<ASPxClientGantt>>

Event Data

The TaskShowing event's data class is ASPxClientGanttTaskShowingEventArgs. The following properties provide information specific to this event:

Property Description
cancel Specifies whether to cancel the related action (for example, row edit, export). Inherited from ASPxClientCancelEventArgs.
container Returns a container for the task’s content.
item Contains information about a task object and its settings.

Remarks

Use the TaskShowing event to specify custom content for the processed task or cancel the task display (the cancel argument).

DevExpress ASP.NET Task Template

Run Demo: ASPxGantt - Client-Side Events Run Demo: MVCxGantt - Client-Side Events

Web Forms:

<dx:ASPxGantt ID="Gantt" >
    <ClientSideEvents TaskShowing="function(s, e) {
        var customContainer = document.createElement("div");  
        customContainer.classList.add("custom-task");  
        customContainer.setAttribute("style", "width:" + e.item.taskSize.width + "px;");  
        customContainer.textContent = e.item.taskData["Subject"];  
        e.container.appendChild(customContainer);
    }" />
</dx:ASPxGantt>

MVC:

@Html.DevExpress().Gantt(settings => {
    settings.Name = "gantt";
    settings.ClientSideEvents.TaskShowing = "function (s, e) { 
        var customContainer = document.createElement("div");  
        customContainer.classList.add("custom-task");  
        customContainer.setAttribute("style", "width:" + e.item.taskSize.width + "px;");  
        customContainer.textContent = e.item.taskData["Subject"];  
        e.container.appendChild(customContainer);    
    }";
    ...
}).Bind(
    GanttDataProvider.Tasks, GanttDataProvider.Dependencies, 
    GanttDataProvider.Resources, GanttDataProvider.ResourceAssignments
).GetHtml()

Concepts

See Also