How do I recognize dynamic buttons as triggers for updating updatepanels?

I have two updatepanels on a page each with a datagrid inside the panels. I need updatepanel B to update it's datagrid when a LinkButton is clicked inside udatepanel A's datagrid. The linkbuttons are dynamically generated for each row of the datagrid.

Thanks

Braden

Stripped Down Example:

<asp:UpdatePanel id="pnl1" runat="server">
<ContentTemplate>
<asp:datagrid id="dgA" runat="server" > ... <asp:LinkButton ID="lbtnSelect" CommandArgument=' ... ' runat="server">...</asp:LinkButton> ... </asp:datagrid>
</ContentTemplate>
</asp:UpdatePanel>

<!-- Next Panel -->

<asp:UpdatePanel id="pnl2" runat="server">
<ContentTemplate>
<asp:datagrid id="dgB" runat="server" > ... </asp:datagrid>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="lbtnSelect" EventName=" ... "/>
</Triggers>
</asp:UpdatePanel>

Unless I misread your post, I think that all you need to do is add the following line inside of your event handler for the link buttons (lbtnSelect_Click, or similar):

pnl2.update();

This should update your pnl1 because the linkbutton's click event fired inside of pnl1, andprogrammatically updating pnl2 with pnl2.update() should take care of updating the other datagrid (dgB). You can get rid of the <Triggers> definition too.

How do I dynamically create updatepanel and then contenttemplate linkbutton and triggers a

I need to be able to create multiple updatepanels which have a link button in them. I have no idea how many updatepanels I'm going to have which have link buttons as the data coming back is from a database. Right now I'm taking the data from a database and putting that into a datalist.

It all works great until I wanted to add a updatepanel to it; then it said the updatepanel cannot be used in that context. So, if it cannot be as simple as what I tried below, how do I dynamically create an updatepanel for each row of data returned from the database?

Each row in the database has a unique ID so the ID of the linkbutton and the asyncpostbacktrigger controlid could be assigned that unique ID.

This works fine without adding updatepanel:
<asp:ScriptManager ID="ajaxClientComponentMgr" EnablePartialRendering="true" runat="server">
<Services>
<asp:ServiceReference Path="~/AjaxWebService.asmx" InlineScript="true" />
</Services>
<Scripts>
<asp:ScriptReference Path="~/Javascript/ajaxJScript.js" />
</Scripts>
</asp:ScriptManager>

<asp:DataList ID="DataSource_Stories_Display" runat="server">
<ItemTemplate>
<asp:Table CssClass="stories_table_block" runat="server">
<asp:TableRow runat="server">
<asp:TableCell CssClass="stories_right_content" runat="server">
<span class="stories_content_header"><%#DataBinder.Eval(Container.DataItem, "Title Name:")%></span><br />
</asp:TableCell>
</asp:TableRow>
</asp:Table>
</ItemTemplate>
</asp:DataList>

This complains of being "not in this context" after adding updatepanel:
(Note: unique_id_for_this_link added just to show that each iteration would have a unique number at that location)

<asp:ScriptManager ID="ajaxClientComponentMgr" EnablePartialRendering="true" runat="server">
<Services>
<asp:ServiceReference Path="~/AjaxWebService.asmx" InlineScript="true" />
</Services>
<Scripts>
<asp:ScriptReference Path="~/Javascript/ajaxJScript.js" />
</Scripts>
</asp:ScriptManager>

<asp:DataList ID="DataSource_Stories_Display" runat="server">
<ItemTemplate>
<asp:Table CssClass="stories_table_block" runat="server">
<asp:TableRow runat="server">
<asp:TableCell CssClass="stories_right_content" runat="server">
<span class="stories_content_header"><%#DataBinder.Eval(Container.DataItem, "Title Name:")%></span><br />

<asp:UpdatePanel ID="something_unique_id_for_this_panel" ChildrenAsTriggers="False" UpdateMode="Conditional" runat="server">
<ContentTemplate>
<asp:LinkButton ID="unique_id_for_this_link" OnClientClick="paneDataRequest();return false;" CssClass="story_link" runat="server">Click Me</asp:LinkButton>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="unique_id_for_this_link" />
</Triggers>
</asp:UpdatePanel>

</asp:TableCell>
</asp:TableRow>
</asp:Table>
</ItemTemplate>
</asp:DataList>

UPDATE: Okay...Swapping where UpdatePanel was located fixed part of the issue.

UpdatePanel, if it is outside of Datalist will work as follows:

<asp:UpdatePanel ChildrenAsTriggers="False" UpdateMode="Conditional" runat="server">
<ContentTemplate>
<asp:DataList ID="DataSource_Stories_Display" runat="server">
<ItemTemplate>
<asp:Table CssClass="stories_table_block" runat="server">
<asp:TableRow runat="server">
<asp:TableCell CssClass="stories_right_content" runat="server">
<span class="stories_content_header"><%#DataBinder.Eval(Container.DataItem, "Title Name:")%></span><br />
<asp:LinkButton OnClientClick="paneDataRequest();return false;" CssClass="story_link" runat="server">Click Me</asp:LinkButton>
</asp:TableCell>
</asp:TableRow>
</asp:Table>
</ItemTemplate>
</asp:DataList>
</ContentTemplate>
<Triggers>
</Triggers>
</asp:UpdatePanel>

New problem discovered!

If I try to assign an ID to the asp:LinkButton (a unique value for each row of database data) I just end up getting all types of errors:

<asp:LinkButton id="some_unique_id" OnClientClick="paneDataRequest();return false;" CssClass="story_link" runat="server">Click Me</asp:LinkButton>

If the ID is omitted, it works fine...not what I'm after.

Next Question:

How do I assign a unique ID number to LinkButton? If I cannot assign it, how can I determine the IDs which are assigned to it so that I can build the <triggers></triggers> part of the updatepanel control?

UPDATE 2:

Visual Studio .Net Beta 2, using the scenario above from second post, does not auto-generate IDs (when you view source of the generated page) for:

<asp:LinkButtonOnClientClick="paneDataRequest();return false;"CssClass="story_link"runat="server"></asp:LinkButton>

Visual Studio .Net Beta 2, using the scenario above from second post, does auto-generate name values (although not IDs) for buttons such as:

<asp:ButtonOnClientClick="paneDataRequest();return false;"Text="default"runat="server"></asp:Button>

How can I tell when an updatepanel has finished updating?

Hi,

Hopefully this is a simpe question! I have a couple of UpdatePanels on my page, and at the top a "Save all" button that calls the "Update" method on each of these updatepanels which gets them to save their contents. Immediatly after doing the updates, I need to render a graph of the data. The problem I have is that the UpdatePanel "updates" are all asynchronous, so my graph doesn't always pick up the newly saved information - because its still being saved while the graph is created.

What I need to do is either get the UpdatePanels to update synchronously, or have some way to fire server-side code once they have finished.

Is this possible?

Thanks!

Matt

Why not update the graph at the end of your "Save all" event handler, if that's what it is you want to do?

Hi,

You cann't process multi-Asyncpostbacks at the sametime, You can process them one by one when you click "Save all".

Following is a demo:

<%@. Page Language="C#" %>

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

<script runat="server">
protected void Button1_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(3000);
Label1.Text = "The time is: " + DateTime.Now.ToString();
}
protected void Button2_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(3000);
Label2.Text = "The time is: " + DateTime.Now.ToString();
}
protected void Button3_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(3000);
Label3.Text = "The time is: " + DateTime.Now.ToString();
}
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>UpdatePanelTutorialIntro1</title>
<style type="text/css">
#UpdatePanel1 {
width:300px; height:100px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div style="padding-top: 10px">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdateProgress ID="UpdateProgress1" runat="server">
<ProgressTemplate>
Processing…
</ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<fieldset>
<legend>UpdatePanel</legend>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label><br />
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" />
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
<br />
<br />
<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<fieldset>
<legend>UpdatePanel</legend>
<asp:Label ID="Label2" runat="server" Text="Label"></asp:Label><br />
<asp:Button ID="Button2" runat="server" OnClick="Button2_Click" Text="Button" />
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
<br />
<br />
<asp:UpdatePanel ID="UpdatePanel3" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<fieldset>
<legend>UpdatePanel</legend>
<asp:Label ID="Label3" runat="server" Text="Label"></asp:Label><br />
<asp:Button ID="Button3" runat="server" OnClick="Button3_Click" Text="Button" />
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
<br />
<br />
</div>
</form>

<script type="text/javascript" language="javascript">
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
var thebutton;
function BeginRequestHandler(sender, args)
{
$get('UpdateProgress1').style.display = 'block';
thebutton = args.get_postBackElement();
thebutton.disabled = true;
}
function EndRequestHandler(sender, args)
{
$get('UpdateProgress1').style.display = 'none';
thebutton.disabled = false;
var str = thebutton.id
if(document.getElementById("Button" + (parseInt(str.substring(6, str.length)) + 1)))
document.getElementById("Button" + (parseInt(str.substring(6, str.length)) + 1)).click();
}
</script>

</body>
</html>

Best Regards,

Thanks very much. Your example shows me that I can call the buttons "click" manually using the EndRequestHandler, to then go and call the next one. I think I can use that information to achieve what I was after :)

I have a similar situation. You'll have to register two events EndRequest, InitializeRequest and queuing system.

Please refer tohttp://forums.asp.net/p/1167326/1944939.aspx#1944939 for the code example.

Let me know if this helped.

How can I reset the AJAX Timer component if the mouse is moved!

I have a few pages that use UpdatePanels and Timer components to refresh the content periodically. However I need to have it refresh only when the mouse hasn't been moved for a minute so it doesn't interrupt the user.

I have been using a javascript timer to refresh a custom component that uses callbacks but it is interfering with the AJAX UpdatePanel and causing State Corruption so I would like an all AJAX solution if possible.

Question 1: Can mouse movement reset an Ajax Timer, if so how?

Question 2: Is there a way to trigger the UpdatePanel from Javascript?

1. Use the method show here to get a refrence to the behavior for the timer, thenhttp://ajax.asp.net/docs/ClientReference/Sys.UI/BehaviorClass/BehaviorGetBehaviorsByName.aspx, call

Sys$UI$_Timer$_stopTimer & then this

Sys$UI$_Timer$_startTimer

Not sure if that will work exactly, but, through that or somthing similar you should be able to manipulate the timer on the client side.

2. Take a look at this post, it has a few differnt examples of how to do an update from javascript:http://forums.asp.net/thread/1541012.aspx

Thanks for the help there. I now need to figure out which behaviour name to look for in the timer, i guess?

Easily referencing behavior instances

It used to be tricky to get a reference to a behavior from client script, but now you can simply add a "BehaviorID" attribute to your control's property specification and it will be easily accessible on the client via ASP.NET AJAX's Sys.Application.findComponent(id) method or its $find(id) shortcut. (Note: If BehaviorID isn't specified, the behavior's ID on the client will be the same as the extender control's ClientID.) See DynamicPopulate or ResizableControl for examples.

I guess I should have added... that its used for the AJAX toolkit, so you might not be able to specify the BehaviorID, but you still should be able to get it with the find method.

I have tried the following code but it doesn't change the timer, it still goes off after a minute:

code = "function MainMenuPage_onmousemove(){"
code += " var b = $find('" & MT.ClientID & "');"
code += " if(b){"
code += " mouse_moved=1;"
code += " b.Sys$UI$_Timer$_stopTimer;"
code += " b.Sys$UI$_Timer$_startTimer;"
code += " }"
code += "}"

Please excuse the code formatting above (I create strings of the code snippets I need for the page and then useRegisterClientScriptBlock)

I'm not receiving any Javascript errors when I move the mouse. I know it's finding MT.ClientID as I use another javascript timer to display the mouse_moved variable. Perhaps I'm not changing the actual instance of the timer? Wild guess here. I really need to have more time to study the nitty gritty bits of AJAX but as it is I hardly have time to do this much.

I appreciate your time on this. I hope you have more bright ideas because I'm fresh out.

I tested the below code & it seems to work ... notice how i removed the Sys$UI$_Timer$ from the method call and added a () at the end

 code ="function MainMenuPage_onmousemove(){"; code +=" var b = $find('" + Timer1.ClientID +"');"; code +=" if(b){"; code +=" mouse_moved=1;"; code +=" b._stopTimer();"; code +=" b._startTimer();"; code +=" }"; code +="}";

Awesome. That worked.

Thank you very much.

how can i know which updatepanel in multiple updatepanels at BeginRequest event

hello ,

I have two updatepanels . updatepanel1 and updatepanel2 . updatepanel1 trigger when button1 click . And then updatepanel2 trigger when button2 click . I add one client side event like this

Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(beginRequestHandler);

function beginRequestHandler(sender,args)

{

here . how can i know which updatepanel request ? because i want to do some when updatepanel2 request .

Please help me . show me with sample code .

Any post will be appreciated .

Thanks in advance.

kmhsad.

Why are you trying to track which updatepanel is updating when you can just handle the button that caused the update?

Hello ,

Thank you for your replied . i got idea . I am new for ASP.net . i didn't consider this idea before .

thank