[ASPX]
<ej:Gantt ID="GanttControlResource" QueryCellInfo="QueryCellInfo" RightTaskLabelTemplate="#righttemplate">
</ej:Gantt>
<script type="text/javascript">
var helpers = {};
helpers["_getResource"] = window.getResourceValue;
$.views.helpers(helpers);
// Client side event to customize the TreeGrid cell elements.
function QueryCellInfo(cellArgs) {
if (cellArgs.column.field == "resourceInfo") {
var args = {}; args.resourceInfo = cellArgs.cellValue;
$(cellArgs.cellElement).empty().append($(getResourceValue(args)));
}
}
// Helper method to customize the resource name color.
function getResourceValue(args) {
var htmlText = "";
if (args.resourceInfo && args.resourceInfo.length > 0) {
var resInfo = args.resourceInfo;
htmlText = "<span style=color:" + resInfo[0].Color + ";>" + resInfo[0].Name + "</span>"
for (var index = 1; index < resInfo.length; index++) {
if (index == (resInfo.length - 1))
htmlText = htmlText + "<span style=color:" + resInfo[index].Color + ";>," + resInfo[index].Name + "</span>";
else
htmlText = htmlText + "<span style=color:" + resInfo[index].Color + ";>," + resInfo[index].Name + "</span>";
}
}
return htmlText;
}
</script>
<script type="text/x-jsrender" id="righttemplate">
{{:~_getResource(#data)}}
</script> |
[.CS]
protected void Page_Load(object sender, EventArgs e)
{
//..
this.GanttControlResource.Resources = this.GetResourceCollection();
this.GanttControlResource.DataBind();
}
private List<ResourceObject> GetResourceCollection()
{
List<ResourceObject> resourceCollection = new List<ResourceObject>();
resourceCollection.Add(new ResourceObject() { Id = 1, Name = "Resource1", Color = "green" });
//…
return resourceCollection;
} |
Amazing,
Thank you.