Multiple Simulatenous Triggering Events

Hello,

I have a scenario where I would like to programmaticallyclickmultiplebuttons that are triggering events of UpdatePanels by calling the JavaScript click method on the button. I would then like any of the UpdatePanel's that use the buttons' click event as their trigger to Update.

I'm running into what seems to be a race condition or asychronous problem with executing the click event. After I programmatically click the first button, the UpdatePanel associated with it begins to refresh, but when I programmatically click the second button, the Atlas framework seems to ignore the second click event.

Does anybody have any ideas on how to do something like this where you can progammatically cause multiple triggers to fire in parallel by executing JavaScript on the client side?

Thx, Joelyou may have a cache problem here, did you try to clear it/set it to expire?

Multiple Update Panels & Control Events

Thankfully i've been able to re-create this issue but i'm still not entirely sure why it happens as it does. I've created a page with two update panels, inside of each is a label and a button. Each label is set to the current date when the labels PreRender event fires. The first time this loads, each event fires at pretty much the same time. As expected if i press either of the buttons, both label PreRender events fire and update the corresponding label. However If i set the update mode to conditional on the updatepanel, both labels PreRender events fire but only the one which shares the update panel with the pressed button has the UI updated. In this trivial example thats not too much of a problem, however when I'm loading in a dataset in one of the panels, i dont want the data being re-loaded in each time a different update panel posts back. Thanks in advance, Matt Here's my trivial example HTML and C# c#

protected void Page_Load(object sender, EventArgs e) { }protected void Label1_PreRender(object sender, EventArgs e) { Label1.Text = DateTime.Now.ToString(); }protected void Label2_PreRender(object sender, EventArgs e) { Label2.Text = DateTime.Now.ToString(); }protected void Button2_Click(object sender, EventArgs e) { }protected void Button1_Click(object sender, EventArgs e) { }

<asp:ScriptManager ID="ScriptManager1" runat="server" /> <div> <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"> <ContentTemplate> <asp:Label ID="Label2" runat="server" OnPreRender="Label2_PreRender" Text="Label"></asp:Label> <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Submit 2" /> </ContentTemplate> </asp:UpdatePanel> </div> <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional"> <ContentTemplate> <asp:Label ID="Label1" runat="server" OnPreRender="Label1_PreRender" Text="Label"></asp:Label> <asp:Button ID="Button2" runat="server" OnClick="Button2_Click" Text="Submit One" /> </ContentTemplate> </asp:UpdatePanel>

This is by design. When you have multiple UpdatePanels and each set to Conditional, UI updates only occur in that particular UpdatePanel. You can get more info about UpdatePanels in the docs:http://www.asp.net/AJAX/Documentation/Live/tutorials/UpdatePanelTutorials.aspx

For updating a label like you are, I would utilize PageMethods vs. and UpdatePanel anyway. You can mix the two technologies if you need to. Seehttp://encosia.com/2007/07/11/why-aspnet-ajax-updatepanels-are-dangerous for an excellent example and more information.

-Damien

Multiple UpdatePanels, Multiple Page_Loads

I have two UpdatePanels which fire when a Click event executes on my page. I get two Page_Load events firing because the two update panels are triggered.

Is there a way to run the Page_Load only once but have both panels update?

Thanks :)

Hello,

Do you want to update both the update panels?

You can set UpdateMode="Conditional" for the update panel and can add a AsyncPostBackTrigger for the update panel

<asp:AsyncPostBackTrigger ControlID="btn" EventName="Click" />

Thanks,

Deepesh Verma

I have my update panels set up like you mentioned however I still get the double page_load.

Update panel 1 and Update panel 2 have the following trigger defined:

<asp:asyncpostbacktrigger controlid="btnSearch" eventname="Click" />

If I remove the trigger from the second Update panel then I will get only one page_load, however since I need to update the second update panel I tried to do it through code like this:

up2.Update();

However this also causes the Page_Load to fire again. Any other ideas?

Hello,

This seems that you have two different update panel and for both you have sameasyncpostbacktrigger.

If this is the case then you can have only one update panel to do that.

Thanks,

Deepesh Verma

SuperGhost:

However this also causes the Page_Load to fire again. Any other ideas?

Are you sure that Page_Load is fired twice?

I've made a simple example and Page_Load is fired only once, it shouldn't depend on how many up are updating...

(

Also works when you set the same trigger

<Triggers>
<asp:AsyncPostBackTrigger ControlID="btn" EventName="click" />
</Triggers>

for each up, and won't call this.up2.update( ) in the server side click event

)

aspx:

<%@. Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="AJAXCTPEnabledWebApplication1._Default" %>
<!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>Untitled Page</title>
</head>
<body>
 <form id="form1" runat="server">
 <asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel ID="up1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Button ID="btn" runat="server" Text="test" />
<%= "Load count" + this.LoadCount.ToString( )%>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="up2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<%= "Load count" + this.LoadCount.ToString( )%>
</ContentTemplate>
</asp:UpdatePanel>
 </form>
</body>
</html>

Code-behind:

 
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
namespace AJAXCTPEnabledWebApplication1
{
public partialclass _Default : System.Web.UI.Page
{
private int m_LoadCount = 0;
/// <summary>
/// Gets or sets LoadCount (this property is stored/retrived using the viewstate).
/// </summary>
public int LoadCount
{
get
{
return (int )(this.ViewState["m_LoadCount" ] ?? m_LoadCount );
}
set
{
this.ViewState["m_LoadCount" ] = m_LoadCount =value;
}
}
protected override void OnInit( EventArgs e )
{
base.OnInit( e );
this.btn.Click +=new EventHandler( btn_Click );
}
private void btn_Click(object sender, EventArgs e )
{
this.up2.Update( );
}
protected void Page_Load(object sender, EventArgs e )
{
this.LoadCount++;
}
}
}
  

My extender control wires its events, then seems to forget what it is!

I've created an extender using the Ajax Extender Control Template. It takes a TextBox as its TargetControl and adds a couple of drop downs to its child controls. Then it responds to the onblur event of the text box. It is supposed to set the values of the drop downs before it posts back. The problem is that when the text box fires its 'blur' event I can't use the 'this' keyword to refer to any of the classes properties or methods. Here is a brief snippett:

Company.Web.MASW.ProductAutoCompleteBehavior.prototype = { initialize : function() { Company.Web.MASW.ProductAutoCompleteBehavior.callBaseMethod(this,'initialize'); $addHandler(this.get_element(),'blur',this._elementChanged ); $addHandler(this._DiameterElement,'click',this._setElementValue ); $addHandler(this._TypeElement,'click',this._setElementValue ); },... _elementChanged : function(e) { alert(this.get_element()); }, _setElementValue : function(e) { alert( this._DiameterElement ); }}

The alert commands just verify that I've managed to make the connection to the right input element. It should pop up and say [object] but I get a script error saying object does not support this property or method. I just can't understand how it's calling the right event but can't see it's own properties. Could It be that it's inheriting from the AjaxToolkit.BehaviorBase class?

It seems as though I have a lot to learn about how to connect everything in Ajax. I've done a fair amout of JavaScript and I've done a fair amount of JScript in ASP. I have got a lot to learn about how Ajax connects ECMA, EMCA, E=MC², or what ever it's called. I just can't fool with it much more for now so consider this 'resolved'. Thanks to all those who read this and said "what in the world is he up to?"