Items without title and description prevent other items displaying them

Progress® Telerik® UI for ASP.NET AJAX Feedback Portal

Create an account Log In

Back to Feed

Request a Feature Report a Bug

Approved

Last Updated: 28 Mar 2019 15:05 by ADMIN

SWAT

Created on: 22 Jan 2019 14:04

Category: ImageGallery

Type: Bug Report

Items without title and description prevent other items displaying them

When you have 3 documents with picture, and texts in all - the texts are shows as expected. but when one of them does not have text and title, the loop of the gallery stop showing it for the other pictures.

<telerik:RadImageGallery ID="RadImageGallery1" runat="server">

<ThumbnailsAreaSettings ThumbnailWidth="140px" Width="140px" Position="Left" ScrollOrientation="Vertical" />

<Items>

<telerik:ImageGalleryItem ImageUrl="Images/Yoga.jpg" Title="Title 1" />

<telerik:ImageGalleryItem ImageUrl="Images/Swimming.jpg" Title="Title 2"

/>



            <%-- Title container disappears here and will not show up with the rest of the items --%>

<telerik:ImageGalleryItem ImageUrl="Images/Surfing.jpg"

/>

<telerik:ImageGalleryItem ImageUrl="Images/Snowboarding.jpg" Title="Title 4" />

<telerik:ImageGalleryItem ImageUrl="Images/Skiing.jpg" Title="Title 5" />

</Items>

</telerik:RadImageGallery>

1 comment

ADMIN

Attila Antal

Posted on: 22 Jan 2019 14:27

We've found two workaround that might be feasible in some scenarios:

Workaround 1

Define the Title property and use "white-space" as value (see marked with yellow)

<telerik:RadImageGallery ID="RadImageGallery1" runat="server">

<ThumbnailsAreaSettings ThumbnailWidth="140px" Width="140px" Position="Left" ScrollOrientation="Vertical" />

<Items>

<telerik:ImageGalleryItem ImageUrl="Images/Yoga.jpg" Title="Title 1" />

<telerik:ImageGalleryItem ImageUrl="Images/Swimming.jpg" Title="Title 2" />

<telerik:ImageGalleryItem ImageUrl="Images/Surfing.jpg" Title=" " />

<telerik:ImageGalleryItem ImageUrl="Images/Snowboarding.jpg" Title="Title 4" />

<telerik:ImageGalleryItem ImageUrl="Images/Skiing.jpg" Title="Title 5" />

</Items>

</telerik:RadImageGallery>

Workaround 2

Using JavaScript withing the OnImageLoading client-event:

<telerik:RadImageGallery ID="RadImageGallery1" runat="server">

<ClientSettings>

<ClientEvents OnImageLoading="OnImageLoading" />

</ClientSettings

>

     <%-- Items --%>

</telerik:RadImageGallery>

OnImageLoading event handler:

function OnImageLoading(sender, args) {

var item = args.get_item();

if ((item.get_title() || item.get_description()) && sender.isPlaying()) {

var rig = $(sender.get_element());

var hiddenControl = rig.find(".rigPrevButton:hidden, .rigNextButton:hidden, .rigDescriptionBox:hidden");

if (hiddenControl.length) {

hiddenControl.show();

}