links are not working in RadTileList

4 posts, 0 answers
  1. Usha
    Usha avatar
    1 posts
    Member since:
    May 2012

    Posted 03 Jul 2013 Link to this post

    Hello Team,
    I have links within RadContentTemplateTile. On click it should redirect to specified URL, But Link is not working.
    The same will work if I remove EnableDragAndDrop="true".
    I need drag able Tile and links inside it.
    Here is my sample code.
    <telerik:RadScriptManager runat="server" ID="RadScriptManager" />
        <telerik:RadTileList runat="server" ID="RadTileList1" TileRows="1" Skin="Glow" ScrollingMode="None" EnableDragAndDrop="true" >
            <Groups>
          <telerik:TileGroup>
    <telerik:RadContentTemplateTile CssClass="tileContent" Shape="Wide" Height="250px" BackColor="#00899E" >
         <ContentTemplate>
           1. <a href="This'>http://www.inszoom.com/">This is a test message (Jon Doe) </a>
          <br />
          2. Send the files for this client (H1B - Will Smith)
          <br />
          3. Bill this client (ABC Corporation)
         </ContentTemplate>
         <Title Text="Test links"></Title>
         <Badge Value="5" />
         </telerik:RadContentTemplateTile>
                    </telerik:TileGroup>
         </Groups>
     </telerik:RadTileList>
  2. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3602 posts

    Posted 04 Jul 2013 Link to this post

    Hi Usha,

    The main purpose of the tiles is to navigate the user, so you can set the desired URL to the NavigateUrl property of the given tile. This is why the click event is consumed by the tile itself and not by the anchor.

    Nevertheless, if you want to use anchors you can have them navigate with some JavaScript:
    <telerik:RadTileList runat="server" ID="RadTileList1" EnableDragAndDrop="true" OnClientLoad="attachEventHandlersToAnchors">
        <Groups>
            <telerik:TileGroup>
                <telerik:RadContentTemplateTile Name="TileWithAnchors">
                    <ContentTemplate>
                        <a href="http://www.telerik.com/">some link</a>
                    </ContentTemplate>
                </telerik:RadContentTemplateTile>
            </telerik:TileGroup>
        </Groups>
    </telerik:RadTileList>
    function attachEventHandlersToAnchors(sender)
    {
        //get the desired tile, or loop throught all content template tiles
        var tile = sender.get_tileByName("TileWithAnchors");
        if (tile)
        {
            $telerik.$("a", tile.get_element()).mousedown(havigateToLink);
        }
    }
    function havigateToLink(evt)
    {
        //cancel the mousedown event to prevent it from reaching the tilelist
        if (evt) $telerik.cancelRawEvent(evt);
        var url = this.href;
        var target = this.target;
        //perform navigation with JS
        if (url)
        {
            if (target && target == "_blank")
                window.open(url);
            if (target && target == "_parent")
                window.parent.location.href = url;
            if (target && target == "_top")
                window.top.location.href = url;
            else if (!target || target == "_self")
                window.location.href = url;
            else //uses jQuery to get a frame that is the target
            {
                var targetFrame = $telerik.$("iframe[name='" + target + "']").get(0)
                                              || $telerik.$("frame[name='" + target + "']").get(0)
                                              || $telerik.$("#" + target).get(0);
     
                if (targetFrame && targetFrame.tagName.toLowerCase().indexOf("frame") > -1)
                    targetFrame.setAttribute("src", url);
            }
        }
    }



    Regards,
    Marin Bratanov
    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.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Bob
    Bob avatar
    46 posts
    Member since:
    Apr 2012

    Posted 22 Dec 2014 Link to this post

    Hello Marin,

    We have need to click on pie slices and legend items within a RadHtmlChart hosted within a RadContentTemplateTile.  We understand from your statements above, why this is not working.  However, we're unable to create a workaround for this as the chart is rendered as an SVG tag.  Can you help us get this to work?

    When we run the RadHtmlChart without the Tile, the clientside events are working correctly.  What we need is somehow for the RadContentTemplateTile to ignore the click and pass it to the SVG when the NavigateUrl is empty.  Is this possible?

    Thanks...Bob Baldwin
    Trabon
  5. Bob
    Bob avatar
    46 posts
    Member since:
    Apr 2012

    Posted 22 Dec 2014 in reply to Bob Link to this post

    Hello Marin,

    Never mind this request.  When we changed your code to handle the mousedown on the svg instead of the anchor, and only called "$telerik.cancelRaweEvent(evt)", the tile ignored the event and the chart client side code events worked correctly.

    Thank you,
    Bob Baldwin
    Trabon Solutions
Back to Top