Create a Hyperlink column

2 posts, 0 answers
  1. Peter
    Peter avatar
    13 posts
    Member since:
    May 2016

    Posted 16 Oct 2017 Link to this post

    Requirements

    Telerik Product and Version

    UI for ASP.NET AJAX 2017 R3

    Supported Browsers and Platforms

    all browsers supported by Telerik UI for ASP.NET AJAX suite

    Components/Widgets used (JS frameworks, etc.)

    RadGantt, .NET 4.0/4.5 C#
    PROJECT DESCRIPTION 

    This example demonstrates how to convert the content of a cell into a hyperlink.

    The conversion is achieved by iterating all tasks in the OnClientDataBound event and based on their unique id (_uid property of the dataItem) the corresponding row elements are found. Once a reference to the row is obtained, the desired cell is accessed and modified as demonstrated in the attached project. 
     
    <telerik:RadGantt runat="server" OnClientDataBound="OnClientDataBound" ID="RadGantt1" SelectedView="WeekView" >
    </telerik:RadGantt>
    var $ = $telerik.$;
    function OnClientDataBound(sender, args) {
        var dataItems = sender.get_allTasks();
     
        for (var j = 0; j < dataItems.length; j++) {
            var dataItem = dataItems[j];
            var row = $("[data-uid='" + dataItem._uid + "']");
     
            // .eq(1) determines which column should be converted into a hyperlink
            var span = row.find("td").eq(1).find("span").last();
     
            span.replaceWith(function () {
                // custom logic for creating the link URL
                var url = $.trim($(this).text());
                return '<a href="' + url + '" target="_blank">' + url + '</a>';
            });
        }
    }
  2. Kasim
    Kasim avatar
    16 posts
    Member since:
    Feb 2016

    Posted 19 Mar in reply to Peter Link to this post

    The example you shared is good and does satisfy our requirement for now. However, I would recommend to have Hyperlink column as one of the default column types for custom columns within RadGantt chart.
Back to Top