<
telerik:RadImageGallery
runat
=
"server"
Width
=
"300px"
Height
=
"300px"
LoopItems
=
"true"
ID
=
"rigFeaturedNews"
>
<
ImageAreaSettings
Width
=
"300px"
Height
=
"300px"
/>
<
ToolbarSettings
ShowFullScreenButton
=
"false"
ShowSlideshowButton
=
"false"
ShowThumbnailsToggleButton
=
"false"
/>
</
telerik:RadImageGallery
>
I have added two images to the gallery using code behind. On loading the page, the first image displays just fine. At the bottom, the thumbnails for both images are displayed. However, when I click the "next" button, or click on the thumbnail for the second picture, the loading spinner pops up, and the image grays, but the second image never loads.
Any idea what could be causing this?
11 Answers, 1 is accepted
The presented issue is rather strange and does not appear in a simple test application on our end. I suppose that some error appears on the page and this is preventing the image from loading.
Therefore could you please inspect your server response and verify if any errors appear on the page?
Regards,
Maria Ilieva
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.
If it makes a difference - this ImageGallery is inside of a DotNetNuke module.
Unfortunately the RadControls are no longer supported in DotNetNuke and we no longer release specific package for DNN implementation. We no longer test our controls in DNN platform and could no be completely sure what is causing the issue.
I would suggest you to test the same scenario put of DNN and see how it goes.
Regards,
Maria Ilieva
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.
I pulled the RadImageGallery out into its own project and put it as the only control on a Web Forms page. I'm having the same issue - except now the spinner isn't displaying either. The thumbnails are loading correctly, and the caption text is loading correctly.
Here's the way I'm setting this in the code behind, maybe that's the issue:
foreach
(Article article
in
articles)
{
ImageGalleryItem articleItem =
new
ImageGalleryItem();
articleItem.Description = article.ArticleIntro;
articleItem.ImageDataValue = article.ArticleImageBytes.ToArray();
rigFeaturedNews.Items.Add(articleItem);
}
The "article.ArticleImageBytes()" field is pulled from a database, where we have images stored in binary format.
The first image is loading correctly.
Could you please try to pass the binary image form the DB using the RadImageGallery's NeedDataSource event as shown in this online demo and verify how it goes?
Regards,
Maria Ilieva
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.
I changed my code to use the NeedDataSource event, using a DataTable as shown in the online demo. However, I am still having the exact same issue; the first image loads, and the thumbnails load correctly, but the main image doesn't change when clicking next. It should be noted that the description field and title change correctly; it is just the image that remains static.
In case the provided suggestion do not help I would kindly ask you to send us the entire page markup as well as the related cod behind. Thus we can try to recreate the same scenario on our side and see if we will be able to isolate the root cause of the issue.
Regards,
Maria Ilieva
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.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html>
<
html
xmlns
=
"http://www.w3.org/1999/xhtml"
>
<
head
runat
=
"server"
>
<
title
></
title
>
</
head
>
<
body
>
<
telerik:RadScriptManager
runat
=
"server"
/>
<
telerik:RadImageGallery
runat
=
"server"
Width
=
"970px"
Height
=
"400px"
OnNeedDataSource
=
"rigFeaturedNews_NeedDataSource"
DataDescriptionField
=
"ArticleIntro"
DataImageField
=
"ArticlePreviewImage"
DataTitleField
=
"ArticleTitle"
LoopItems
=
"true"
ID
=
"rigFeaturedNews"
>
<
ToolbarSettings
ShowFullScreenButton
=
"false"
ShowSlideshowButton
=
"false"
ShowThumbnailsToggleButton
=
"false"
/>
<
ThumbnailsAreaSettings
Mode
=
"ImageSliderPreview"
/>
</
telerik:RadImageGallery
>
</
body
>
</
html
>
and the code behind:
using
System;
using
System.Collections.Generic;
using
System.Data;
using
System.Data.SqlClient;
using
System.Linq;
using
System.Web;
using
System.Web.UI;
using
System.Web.UI.WebControls;
using
Telerik.Web.UI;
public
partial
class
_Default : System.Web.UI.Page
{
protected
void
Page_Load(
object
sender, EventArgs e)
{
}
private
static
DataTable getAllFeaturedArticlesAsDataTable()
{
LSCollegeNewsDataContext newsContext =
new
LSCollegeNewsDataContext();
var featured = (from a
in
newsContext.Articles
where a.ArticleIsFeatured ==
true
select
new
{ a.ArticlePreviewImage, a.ArticleIntro, a.ArticleTitle });
return
ToDataTable(newsContext, featured);
}
private
static
DataTable ToDataTable(System.Data.Linq.DataContext ctx,
object
query)
{
if
(query ==
null
)
{
throw
new
ArgumentNullException(
"query"
);
}
IDbCommand cmd = ctx.GetCommand(query
as
IQueryable);
SqlDataAdapter adapter =
new
SqlDataAdapter();
adapter.SelectCommand = (SqlCommand)cmd;
DataTable dt =
new
DataTable(
"sd"
);
try
{
cmd.Connection.Open();
adapter.FillSchema(dt, SchemaType.Source);
adapter.Fill(dt);
}
finally
{
cmd.Connection.Close();
}
return
dt;
}
protected
void
rigFeaturedNews_NeedDataSource(
object
sender, ImageGalleryNeedDataSourceEventArgs e)
{
rigFeaturedNews.DataSource =
new
DataView(getAllFeaturedArticlesAsDataTable());
}
}
var featured = from a
in
newsContext.Articles
where a.ArticleIsFeatured ==
true
select
new
{
a.ArticleIntro,
ArticlePreviewImage = a.ArticlePreviewImage.ToArray(),
ArticleImage = a.ArticleImage.ToArray(),
a.ArticleTitle,
};
rigFeaturedNews.DataSource = featured.ToList();
A little bizarre but glad it's working. Thanks!
I'm glad that you were able to find a fix on your end. However, we will continue to research this case locally and will get back to you with any findings on the matter.
Regards,
Maria Ilieva
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.