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

Loading Panel on show when clicked on a linkbutton in the repeater nested in a RadGrid

6 Answers 487 Views

Ajax

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

jing asked on 03 Sep 2010, 10:33 AM

I had a LinkButton that is repeated inside the repeater. The repeater is nested inside the RadGrid.
When clicked on the LinkButton, there is partial postback but loading panel is not shown.

How do I change it have loading panel once the link button is clicked?

<telerik:RadAjaxManager ID="AjaxManager" runat="server">

<telerik:AjaxSetting AjaxControlID="Grid1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="Grid1" LoadingPanelID="AjaxLoadingPanel" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadGrid ID="Grid1" runat="server" AutoGenerateColumns="False">

<MasterTableView DataKeyNames="ID" ClientDataKeyNames="ID,Write" TableLayout="Fixed">

<Columns>

....

<telerik:GridTemplateColumn HeaderText="Sub Data" UniqueName="SubData">

<ItemTemplate>

<asp:Repeater ID="Repeater1" runat="server"

DataSource='<%# ((DataRowView)Container.DataItem).Row.GetChildRows("SubData") %>' OnItemCommand="Repeater1_ItemCommand">

<ItemTemplate>

<asp:LinkButton ID="LinkButton1" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "[\"Name\"]")%>' CommandName="RELOAD" />

</ItemTemplate>

</asp:Repeater>

</ItemTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

<ClientSettings>

...

</ClientSettings>

</telerik:RadGrid>

protected void Repeater1_ItemCommand(object source, RepeaterCommandEventArgs e)

{

if (e.CommandName == "RELOAD")

{

...

// rebind the grid1

}

Thanks in advance.

6 Answers, 1 is accepted

answered on 07 Sep 2010, 11:31 AM

loading-image.zip

Hello Jing,

I tried to replicate the issue which you described but to no avail. I followed closely your scenario and it worked as expected. Could you please check out the attached project and tell me what am I missing out.

Regards,
Pavlina
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

answered on 08 Sep 2010, 03:58 AM

The problem lay on the tooltip. When the tooltip is loading, click on the link button, the loading panel will not shown. Is there a way to make the loading panel show?

I have editing your code attached in the previous post.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Import Namespace="System.Data" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

<style type="text/css">

.loading

{

background-color: #fff;

height: 100%;

width: 100%;

text-align: center;

}

.loading img

{

margin-top: 50px;

}

</style>

</head>

<body>

<form id="form1" runat="server">

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">

</telerik:RadScriptManager>

<telerik:RadAjaxManager ID="AjaxManager" runat="server">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="FlowSheetGrid">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="TreeView1" LoadingPanelID="AjaxLoadingPanel" />

<telerik:AjaxUpdatedControl ControlID="FlowSheetGrid" LoadingPanelID="AjaxLoadingPanel" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="AjaxLoadingPanel" runat="server" Transparency="30">

<div class="loading">

<asp:Image ID="ImageLoading" runat="server" ImageUrl="loading.gif" />

</div>

</telerik:RadAjaxLoadingPanel>

<telerik:RadToolTipManager ID="ToolTipManager1" runat="server" Width="250px"

Skin="Telerik" AnimationDuration="200" RelativeTo="Element" Animation="Slide"

Position="BottomCenter" HideEvent="LeaveTargetAndToolTip" OnAjaxUpdate="ToolTipManager1_AjaxUpdate" />

<telerik:RadGrid ID="FlowSheetGrid" runat="server" Skin="Vista" AllowPaging="true" OnItemDataBound="FlowSheetGrid_ItemDataBound">

<MasterTableView AutoGenerateColumns="false">

<Columns>

<telerik:GridBoundColumn DataField="Name" HeaderText="Name" UniqueName="Name">

</telerik:GridBoundColumn>

<telerik:GridTemplateColumn HeaderText="Sub Data" UniqueName="SubData">

<ItemTemplate>

<asp:Repeater ID="Repeater1" runat="server" DataSource='<%# ((DataRowView)Container.DataItem).Row.GetChildRows("TableToSubTable") %>'

OnItemCommand="Repeater1_ItemCommand">

<ItemTemplate>

<asp:LinkButton ID="LinkButton1" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "[\"Name\"]")%>'

CommandName="RELOAD" />

</ItemTemplate>

</asp:Repeater>

</ItemTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

<ClientSettings>

<Scrolling AllowScroll="True" UseStaticHeaders="true" SaveScrollPosition="true" FrozenColumnsCount="1" />

</ClientSettings>

</telerik:RadGrid>

</form>

</body>

</html>

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using Telerik.Web.UI;

using System.Data;

using System.Data.SqlClient;

using System.Data.OleDb;

public partial class _Default : System.Web.UI.Page

{

private void BindGrid(string addSomeText)

{

DataSet ds = new DataSet();

DataTable table1 = new DataTable();

table1.TableName = "Table1";

table1.Columns.Add("ID");

table1.Columns.Add("Name");

ds.Tables.Add(table1);

DataTable subTable = new DataTable();

subTable.TableName = "SubTable";

subTable.Columns.Add("ParentID");

subTable.Columns.Add("Name");

ds.Tables.Add(subTable);

ds.Relations.Add("TableToSubTable", ds.Tables["Table1"].Columns["ID"], ds.Tables["SubTable"].Columns["ParentID"]);

for (int i = 1; i <= 5; i++)

{

DataRow row = ds.Tables["Table1"].NewRow();

row["ID"] = i;

row["Name"] = "Name " + addSomeText + " " + i;

ds.Tables["Table1"].Rows.Add(row);

for (int x = 1; x <= 2; x++)

{

DataRow childRow = ds.Tables["SubTable"].NewRow();

childRow["ParentID"] = i;

childRow["Name"] = "Name " + x;

ds.Tables["SubTable"].Rows.Add(childRow);

}

FlowSheetGrid.DataSource = ds.Tables["Table1"];

FlowSheetGrid.DataBind();

}

protected void Page_Load(object sender, EventArgs e)

{

if (!IsPostBack)

{

BindGrid("");

}

protected void Repeater1_ItemCommand(object source, RepeaterCommandEventArgs e)

{

BindGrid("(LinkButton Clicked)");

System.Threading.Thread.Sleep(1000);

}

protected void ToolTipManager1_AjaxUpdate(object sender, ToolTipUpdateEventArgs e)

{

Label lbl = new Label();

lbl.Text = e.TargetControlID + " mouseover";

e.UpdatePanel.ContentTemplateContainer.Controls.Add(lbl);

System.Threading.Thread.Sleep(1000);

}

protected void FlowSheetGrid_ItemDataBound(object sender, GridItemEventArgs e)

{

if (e.Item.ItemType == GridItemType.Item || e.Item.ItemType == GridItemType.AlternatingItem)

{

Repeater rpt = (Repeater)e.Item.FindControl("Repeater1");

foreach (RepeaterItem item in rpt.Items)

{

LinkButton link1 = (LinkButton)item.FindControl("LinkButton1");

ToolTipManager1.TargetControls.Add(link1.ClientID, link1.Text, true);

}

Accepted