How to add HyperLink into Image Gallery

5 posts, 0 answers
  1. David
    David avatar
    8 posts
    Member since:
    Aug 2014

    Posted 12 Aug 2014 Link to this post

    Hi Admin,
    I have a problem when i want to click each item of images( Image, Tillte Image) on Image Gallery. It will be show the ortherpage, content infomations of Detail Images.
    this is my code!
        <telerik:RadImageGallery runat="server" ID="RadImageGallery_Hotnews" Height="350px" Width="600px"        
            DataImageField="NewsImage"  DataTitleField="Title" DataDescriptionField="ShortDesc"  DataKeyNames="NewsId" RenderMode="Auto"   OnNeedDataSource="RadImageGallery_Hotnews_NeedDataSource" Skin="Metro" LoopItems="True">
             <ThumbnailsAreaSettings ScrollOrientation="Horizontal" />
                <ToolbarSettings ShowSlideshowButton="true"   ShowItemsCounter="true"  ItemsCounterFormat="Images {0} of {1}"/>
               <ThumbnailsAreaSettings ThumbnailWidth="120px" ThumbnailHeight="80px" Height="80px" />
                <ImageAreaSettings Height="300px" />
    <ClientSettings>
        <AnimationSettings SlideshowSlideDuration="4000">
        </AnimationSettings>
    </ClientSettings>
       </telerik:RadImageGallery>
    ---------------------
    Datasoure

    ---------
     protected void RadImageGallery_Hotnews_NeedDataSource(object sender, ImageGalleryNeedDataSourceEventArgs e)
            {
                DataView dw = new DataView( GetData_HotNews());
                RadImageGallery_Hotnews.DataSource = dw;
            }
    ------------
    Can you show me which method to solve this problem?
    Thanks!



  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 13 Aug 2014 in reply to David Link to this post

    Hi David,

    As a work around try to attach the click event of 'RadImageGallery2_ImageWrapper' (div) and from that you will get the URL and Description of the selected image. Open a new page using window.open and pass these variable as query string to show the image and description in a new page. Please take a look into the below code snippet.

    JavaScript:
    function pageLoad() {
        $('#RadImageGallery2_ImageWrapper').click(function () {
            var imageSrc = $('#RadImageGallery2_ImageWrapper')[0].innerHTML.split('src')[1].split(">")[0].split('"')[1];
            var description = $('.rigDescriptionBox')[0].innerText;
            window.open("Default.aspx?imageSrc=" + imageSrc + "&description=" + description, '_blank');
        });
    }

    Default.ASPX:
    <img id="imgFrmGallery" runat="server"/>
    <span id="spnImageDescription" runat="server"></span>

    Default.ASPX.CS:
    protected void Page_Load(object sender, EventArgs e)
    {
        string imageSrc = Request.QueryString["imageSrc"];
        string imageDesc = Request.QueryString["description"];
        imgFrmGallery.Src = imageSrc + "&type=rbi";
        spnImageDescription.InnerText = imageDesc;
    }

    Thanks,
    Shinu.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. David
    David avatar
    8 posts
    Member since:
    Aug 2014

    Posted 13 Aug 2014 Link to this post

    Thanks!

    If i want to get IDImage(DataKeyName) from Database, not id image of ImageGallery?

    I hope you would have a method for me!



  5. David
    David avatar
    8 posts
    Member since:
    Aug 2014

    Posted 13 Aug 2014 in reply to David Link to this post

    I want to get the DatakeyName because i want to query  Infomations from database
  6. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 14 Aug 2014 in reply to David Link to this post

    Hi David,

    The desired functionality is not currently supported in RadImageGallery, take a look into this forum thread.

    Thanks,
    Shinu.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017