All UpdatePanels on page updating on __doPostBack - asp.net

I am experiencing off behaviour when trying to update an UpdatePanel via JavaScript when multiple UpdatePanels are on the page.
Will try to keep it short:
I'm already setting the UpdateMode to Conditional
I am passing in the correct ClientID of the UpdatePanel into the __EventTarget
In the code-behind, I am successfully able to find the target control
But for some reason, the OnLoad of every UpdatePanel on the page is fired.
Below is a snippet of code - any idea why this is happening?
Ascx:
<div class="updatePanelWrapper">
<asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" RenderMode="Inline" OnLoad="UpdatePanel1Load"
runat="server">
<ContentTemplate>
<asp:Panel ID="Panel1" runat="server">
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div class="updatePanelWrapper">
<asp:UpdatePanel ID="UpdatePanel2" UpdateMode="Conditional" RenderMode="Inline" OnLoad="UpdatePanel2Load"
runat="server">
<ContentTemplate>
<div>
<asp:Panel ID="Panel2" runat="server">
</asp:Panel>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</div>
CodeBehind:
protected void UpdatePanel1Load(object sender, EventArgs e)
{
UpdatePanelLoad(sender, e);
}
protected void UpdatePanel2Load(object sender, EventArgs e)
{
UpdatePanelLoad(sender, e);
}
protected void UpdatePanelLoad(object sender, EventArgs e)
{
// if only a async postback then load the control
if (ScriptManager.GetCurrent(Page).IsInAsyncPostBack)
{
// Some Logic ...
}
}
JavaScript (where I'm triggering the ASYNC PostBack):
var updatePanelWrappers = $(".updatePanelWrapper");
var availableWrapper = updatePanelWrappers[0];
var updatePanelElement = $(availableWrapper).children()[0];
var updatePanelId = $(updatePanelElement).attr("id");
window.__doPostBack(updatePanelId, "Some Arguments...");

With an UpdatePanel callback the page still goes through most of its lifecycle; which includes all of the Load events.

Related

Unable to trigger JavaScript method from code-behind using Update Panel

Issue details:
After saving the data in DB, I need to show an alert to the user.
For this, I have registered the script from code-behind.
But it is NOT working with update-panel whereas it works as expected without update-panel.
I need to make it work with update-panel.
I tried by adding $(document).ready(function () while registering the script, but it didn't work.
Then, I tried with ScriptManager.RegisterClientScriptBlock() method instead of Page.ClientScript.RegisterStartupScript(), but it also didn't work.
Here is the code snippet of web page (ASPX):
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:Button ID="btnOutsideUpdatePanel" runat="server" Text="Outside UpdatePanel" OnClick="btnOutsideUpdatePanel_Click" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="btnInsideUpdatePanel" runat="server" Text="Inside UpdatePanel" OnClick="btnInsideUpdatePanel_Click" />
</ContentTemplate>
</asp:UpdatePanel>
<uc1:Child runat="server" id="Child1" />
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<uc1:Child runat="server" id="Child2" />
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
Here is the code snippet of user-control (ASCX):
<%# Control Language="C#" AutoEventWireup="true" CodeBehind="Child.ascx.cs" Inherits="UpdatePanelAndScript.Child" %>
<asp:Button ID="btnUserControl" runat="server" Text="User Control" OnClick="btnUserControl_Click" />
Code-behind of web-page:
protected void btnOutsideUpdatePanel_Click(object sender, EventArgs e)
{
Page.ClientScript.RegisterStartupScript(this.GetType(), "ShowSuccess", "alert('Hi');", true);
}
protected void btnInsideUpdatePanel_Click(object sender, EventArgs e)
{
Page.ClientScript.RegisterStartupScript(this.GetType(), "ShowSuccess", "alert('Hi');", true);
}
Code-behind of user-control:
protected void btnUserControl_Click(object sender, EventArgs e)
{
Page.ClientScript.RegisterStartupScript(this.GetType(), "ShowSuccess", "alert('Hi');", true);
}
You only need to change the following statement:
Page.ClientScript.RegisterStartupScript
(
this.GetType(),
"ShowSuccess",
"alert('Hi');",
true
);
To:
ScriptManager.RegisterStartupScript
(
this,
this.GetType(),
"ShowSuccess",
"alert('Hi');",
true
);
Reference:
MSDN ScriptManager Class
Registering Partial-Page Update Compatible Scripts
[...] If you are rendering script for use inside an UpdatePanel control, make sure that you call the methods of the ScriptManager control.

ASP.NET UpdatePanel in UserControl doesn't trigger Click event

I have set the following in my ascx file :
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<asp:Button ID="from_dispo_to_affich" runat="server" OnClick="from_dispo_to_affich_Click"/>
</ContentTemplate>
</asp:UpdatePanel>
My problem is that the OnClick event doesn't trigger.
You want to make a javascript function call right?
Change OnClick to OnClientClick. And put () after your function.
OnClientClick="from_dispo_to_affich_Click()"
Otherwise put this event in your codebehind
protected void from_dispo_to_affich_Click(object sender, EventArgs e)
{
// do something
}

How to make UpdatePanel to do Update after custom Event?

I'm setting UpdatePanel1.UpdateMode = UpdatePanelUpdateMode.Conditional; to make manual updates but it doesn't work for some custom events, when I have some event alike here:
protected void Button1_Click(object sender, EventArgs e) {
discovery.FindAlreadyRegisteredServices();
discovery.discoveryClient.FindCompleted += FoundEvent;
protected void FoundEvent(object sender, FindCompletedEventArgs e) {
Label1.Text = (discovery.endpoints.Count > 0) ? discovery.endpoints[0].Address.ToString() : "nothing";
UpdatePanel1.Update();
}
My project is failing with:
An unhandled exception of type 'System.InvalidOperationException' occurred in System.ServiceModel.Internals.dll
Additional information: The Update method can only be called on UpdatePanel with ID 'UpdatePanel1' before Render.
even if I set ChildrenAsTriggers or not. Error message is not clear for me and I can't understand what should I do to process update right after I process my event?
addition:
aspx:
<asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" runat="server">
<ContentTemplate>
<asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
<asp:Label ID="Label1" runat="server" Text=""></asp:Label>
<asp:ListView ID="ListView1" runat="server">
</asp:ListView>
</ContentTemplate>
</asp:UpdatePanel>
I suppose you should change your markup like this
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
....
You should set UpdateMode="Conditional" in your markup itself
protected void Button1_Click(object sender, EventArgs e) {
discovery.FindAlreadyRegisteredServices();
discovery.discoveryClient.FindCompleted += FoundEvent;
// Try to call the update method after calling the custom even but in the click event of the button. Ensure you update the Trigger accordingly in the update panel
**UpdatePanel1.Update();**
}
protected void FoundEvent(object sender, FindCompletedEventArgs e) {
Label1.Text = (discovery.endpoints.Count > 0) ? discovery.endpoints[0].Address.ToString() : "nothing";
}
Try to add AsyncPostBackTrigger to the update panel with update mode as conditional
Although you are doing same thing explicitly.
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" />
</Triggers>
Just to check if there is any other issue, you can set the updateMode property of the update panel to "Always"

ASP.NET - Update panel in Master page, refresh button in Content Page

I have Update panel in Master page:
<asp:ScriptManager id="CartScript" runat="server"></asp:ScriptManager>
<asp:UpdatePanel id="CartBox" runat="server" updateMode="Conditional">
<ContentTemplate>
Košík [ <asp:HyperLink NavigateUrl="~/Account/Login.aspx" ID="ShoppingCart" runat="server" text="" /> ] <asp:LinkButton ID="DeleteCart" runat="server" Text="Vymazat košík" OnClick="ThrowCart_Click" />
</ContentTemplate>
</asp:UpdatePanel>
and Buy Button in Content page:
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<asp:Button ID="BuyButton" Runat="server" Text="Přidat do košíku" onclick="Buy_Click" />
</asp:Content>
So I need add to Update panel AsyncPostBackTrigger for this button.
First i tryed add it from content page:
protected void Page_Load(object sender, EventArgs e)
{
AsyncPostBackTrigger trigger = new AsyncPostBackTrigger();
trigger.ControlID = "BuyButton";
UpdatePanel panel = (UpdatePanel)Master.FindControl("CartBox");
if (panel != null)
{
panel.Triggers.Add(trigger);
}
ScriptManager script = (ScriptManager)Master.FindControl("CartScript");
script.RegisterAsyncPostBackControl(BuyButton);
}
But it did error: A control with ID 'BuyButton' could not be found for the trigger in UpdatePanel 'CartBox'.
So i tried it add from Master page:
protected void Page_Load(object sender, EventArgs e)
{
if ((Button)MainContent.FindControl("BuyButton")!=null)
{
AsyncPostBackTrigger trigger = new AsyncPostBackTrigger();
trigger.ControlID = ((Button)MainContent.FindControl("BuyButton")).ID;
CartBox.Triggers.Add(trigger);
CartScript.RegisterAsyncPostBackControl((Button)MainContent.FindControl("BuyButton"));
}
}
But i got same error. :-(
So can u tell me how I can add to my Update Panel that Button from Content Page can refresh it?
Edit
Place the BuyButton button inside of its own UpdatePanel as well on the content page. Add your AsyncPostBackTrigger to that new UpdatePanel, and then it will be able to find the button, and will use the ScriptManager from the master page.

UpdatePanel wrapped around a user control

I have a user control which contains some buttons and a placeholder. Those buttons cause controls to be added/removed from placeholder. Everything works fine.
Now I want to put this user control in a page, and wrap it in an updatepanel like so:
<asp:UpdatePanel ChildrenAsTriggers="true" ID="UpdatePanelFoo" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<grid:tablegrid ID="tablegrid_chapters" runat="server" SomeProperty="bar" />
</ContentTemplate>
</asp:UpdatePanel>
When I run the page, it's still doing a full postback when I hit one of the buttons inside the user control. What am I doing wrong, and how can I remedy this?
Update:
protected void Page_Init()
{
ScriptManager scr = ScriptManager.GetCurrent(this.Page);
Response.Write("EnablePartialRendering: " + scr.EnablePartialRendering);
}
Outputs "EnablePartialRendering: true"
Make sure you have EnablePartialRendering=true on your ScriptManager in the page.
Update
It looks like your UserControl has no events to be looking for...you have 2 options here. Move the UpdatePanel inside the UserControl .ascx so it can see the button events as children to rig up or add an event for it to see, to do that try something like this:
public event EventHandler Click;
void btn_del_Click(object sender, EventArgs e)
{
if (NumberOfRowControls > 0)
{
var rowToWhack = panel_rows.Controls.Children().Single(x => x.ID == "myrow" + (NumberOfRowControls - 1));
panel_rows.Controls.Remove(rowToWhack);
NumberOfRowControls--;
}
if(Click != null) Click(this, e);
}
void btn_add_Click(object sender, EventArgs e)
{
var row = NewRow(NumberOfRowControls);
panel_rows.Controls.Add(row);
if(Click != null) Click(this, e);
}
And update the UpdatePanel to be looking for it:
<asp:UpdatePanel ID="UpdatePanelFoo" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<grid:tablegrid ID="tablegrid_chapters" runat="server" SomeProperty="bar" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="tablegrid_chapters" EventName="Click">
</Triggers>
</asp:UpdatePanel>
Make sure you add a ScriptManager as well to the page, otherwise there's no UpdatePanel functionality.

Resources