Image Gallery hyperlink

5 posts, 0 answers
  1. Scott
    Scott avatar
    7 posts
    Member since:
    Apr 2014

    Posted 07 Aug 2014 Link to this post

    Good afternoon,

    I was wondering if it is possible to add a hyperlink (server side, not JS please) to individual images contained in a RadImageGallery?

    I have tried adding hyperlinks in the Title & Description fields of the ImageGalleryItems, but the html doesn't get processed and is displayed as text.

    e.g. <telerik:ImageGalleryItem Title="<a href='http://www.google.com'>Item1</a>" ImageUrl="images/image1.jpg" description="<a href='http://www.google.com'>Description text will go here</a>"/>

    The above is purely an example, but ultimately we will be binding the RadImageGallery server side to a dataset containing the Title, Description & ImageURL, hence why Javascript is not an ideal option.

    Many thanks
  2. Radoslav
    Admin
    Radoslav avatar
    1566 posts

    Posted 12 Aug 2014 Link to this post

    Hi Scott,

    Unfortunately the desired functionality currently is not supported into the ImageGallery control. The only way to have links for each image is to add them on the client with JavaScript. However I will forward your requirement to our developers for further consideration. Also you can log a feature request into our public portal in order other people to vote for it:

    http://feedback.telerik.com/Project/108

    Regards,
    Radoslav
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. Scott
    Scott avatar
    7 posts
    Member since:
    Apr 2014

    Posted 19 Aug 2014 Link to this post

    I have added my vote to this suggestion and advise others to do the same:

    Telerik Feedback Portal
  4. Lawrence
    Lawrence avatar
    17 posts
    Member since:
    Jul 2013

    Posted 10 Apr Link to this post

    Hello,

    I know you would like to make the title linkable without using JavaScript, but here is a work around in the meantime. I didn't need to use the description, so I used that to pass my information. What I did was hide the description and pass in the value that is needed to link to another page. From there, you can just add an anchor tag for the title to link. Make sure to add a ClientEvents OnNavigated with your JavaScript function. Here is an example of what I’m talking about:

    <telerik:RadImageGallery>
     <ClientSettings>                                                               
        <ClientEvents OnNavigated="updateTitleLink"/>
      </ClientSettings>
    </telerik:RadImageGallery>
    $(function () {
        updateTitleLink();
    });
     
    function updateTitleLink() {
        $(".rigDescriptionBox").each(function(item, obj){
            var storyId = $(this).find('p').text();
            var element = $(this).find('h4');
            $(element).html("<a href='story.aspx?StoryId=" + storyId +"'>" + $(element).text() + "</a>");
        });
    }
  5. Rumen
    Admin
    Rumen avatar
    14107 posts

    Posted 12 Apr Link to this post

    Thank you for sharing your solution with the community, Lawrence!

    As a small token of gratitude for that I've updated your Telerik points.

    Best regards,
    Rumen
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top