This is a migrated thread and some comments may be shown as answers.

How to add HyperLink into Image Gallery

4 Answers 147 Views
ImageGallery
This is a migrated thread and some comments may be shown as answers.
David
Top achievements
Rank 1
David asked on 12 Aug 2014, 09:22 AM
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!



4 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 13 Aug 2014, 09:12 AM
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.
0
David
Top achievements
Rank 1
answered on 14 Aug 2014, 01:39 AM
Thanks!

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

I hope you would have a method for me!



0
David
Top achievements
Rank 1
answered on 14 Aug 2014, 03:37 AM
I want to get the DatakeyName because i want to query  Infomations from database
0
Shinu
Top achievements
Rank 2
answered on 14 Aug 2014, 05:25 AM
Hi David,

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

Thanks,
Shinu.
Tags
ImageGallery
Asked by
David
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
David
Top achievements
Rank 1
Share this question
or