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

click Thumbnail image event ?

2 Answers 61 Views
ImageGallery
This is a migrated thread and some comments may be shown as answers.
Liu
Top achievements
Rank 1
Liu asked on 24 Dec 2016, 09:38 AM

Hi:

because I don't need ImageArea, and only need ThumbnailsArea, so I hide ImageArea !

I need when user click each image (not scroll or next) at ThumbnailsArea, I can fire some client event , and wish get some information about user selected image. How can I do ?

    <style type="text/css">
        .RadImageGallery .rigActiveImage {
            display:none !important;
        }
    </style>

<telerik:RadImageGallery ID="RadImageGallery1" runat="server" Width="550px" Height="100px" ImagesFolderPath="~\img\"   >
                <ThumbnailsAreaSettings ShowScrollButtons="true" Mode="Thumbnails"  ScrollButtonsTrigger="Hover" Position="Top" ThumbnailsSpacing="10"/>
                <ImageAreaSettings ShowDescriptionBox="False" ShowNextPrevImageButtons="False"  />
                <ToolbarSettings Position="None" ShowFullScreenButton="false" ShowSlideshowButton="false" ShowThumbnailsToggleButton="false" />
 </telerik:RadImageGallery>

2 Answers, 1 is accepted

Sort by
0
Liu
Top achievements
Rank 1
answered on 24 Dec 2016, 10:09 AM
by default, when I click ThumbnailsArea image, the ImageArea will show image that I selected. I want add some code for this event (for example, reload some grid), how can I do ? 
0
Konstantin Dikov
Telerik team
answered on 27 Dec 2016, 12:50 PM
Hi Liu,

The OnNavigated event will fire when you click on a thumbnail for changing the active image or when you change the image with the RadImageGallery navigation:
...
    <ClientSettings>
        <ClientEvents OnNavigated="navigated" />
    </ClientSettings>
</telerik:RadImageGallery>
 
<script>
    function navigated(sender, args) {
        alert("image changed");
    }
</script>

Hope this helps.


Regards,
Konstantin Dikov
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
ImageGallery
Asked by
Liu
Top achievements
Rank 1
Answers by
Liu
Top achievements
Rank 1
Konstantin Dikov
Telerik team
Share this question
or