Update panel problem - asp.net

Here is my code:
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" ChildrenAsTriggers="false" runat="server">
<ContentTemplate>
<asp:Button ID="Button1" runat="server" Text="Click1" OnClick="Button1_Click" />
<br />
<br />
Last refresh
<%=DateTime.Now.ToString() %>
<br />
<br />
<asp:UpdatePanel ID="UpdatePanel2" UpdateMode="Conditional" ChildrenAsTriggers="true" runat="server">
<ContentTemplate>
<asp:Button ID="Button2" runat="server" Text="Click2" OnClick="Button2_Click" />
<br />
<br />
Last refresh
<%=DateTime.Now.ToString() %>
<br />
<br />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button2" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
</div>
</form>
</body>
Im using two update panels here, when i click "Button2" then "UpdatePanel2" was refreshed, if i click "Button1" then both update panel were refreshed, but my need is if i click "Button1" then "UpdatePanel1" have to be refreshed.
Thanks.

This behavior is by design. Because your UpdatePanel2 is nested inside of UpdatePanel1, when you refresh the contents of UpdatePanel1, this includes the child UpdatePanel.
If you want UpdatePanel2 to act separately from UpdatePanel1, you're going to have to take it out of UpdatePanel1 and make it a sibling, rather than a child.

Related

webforms all children performing async postback even when updatemode set to conditional

I have an update panel with UpdateMode set to conditional, and childrenastriggers set to false, but all the controls in the panel are performing async postbacks...
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdateProgress ID="pnlUpdateProgress" DisplayAfter="1" runat="server">
<ProgressTemplate>
Update in progress...
</ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdatePanel runat="server" ID="pnlUpdate" UpdateMode="Conditional" ChildrenAsTriggers="false">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnDoNothing" EventName="Click" />
</Triggers>
<ContentTemplate>
<div runat="server" clientidmode="Static" id="divList">
<asp:Button runat="server" ID="btnDoNothing" Text="Do nothing" OnClick="Unnamed_Click" />
<asp:Button runat="server" ID="btnSync" Text="Sync" OnClick="btnSync_Click" />
<br />
<div class="items_bought_table">
<table style="width: 100%; padding-bottom:24px;">
<thead>
<tr>
<th style="text-align: left;">Description</th>
<th></th>
</tr>
</thead>
<tbody>
<asp:Literal runat="server" ID="litList" />
</tbody>
</table>
</div>
<br />
<asp:Literal runat="server" ID="litDebugText" />
</div>
<div runat="server" clientidmode="Static" id="divEdit">
<asp:HiddenField runat="server" ID="txtEditID" />
<asp:Literal ID="litEditList" runat="server">
</asp:Literal>
<ul>
<li class="full_width pt_10">
Your Product: <em><asp:Literal runat="server" ID="litEditProductName" /></em>
</li>
</ul>
</div>
</ContentTemplate>
</asp:UpdatePanel>
Here both btnSync and btnDoNoting are performing async postbacks, where I would expect only btnDoNothing to post back async, btnSync should perform a full postback
AsyncPostBackTrigger only sets controls that are outside of the panel.
Controls on the page outside of an update panel can refresh an UpdatePanel control by defining them as triggers. Triggers are defined by using the AsyncPostBackTrigger element.
Controls that postback will always postback. I think the ChildrenAsTriggers="false" won't stop the postbacks - it will just stop the content from updating.
As #wazz stated in their answer, this is normal behavior in an update panel. To make a full back you need to make a "PostBackTrigger" as documented in the answer to this question.
<asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" runat="server">
<ContentTemplate>
...
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="myFullPostBackControlID" />
</Triggers>
</asp:UpdatePanel>

Confusion about UpdatePanel Loading image

I am trying to learn how to use UpdatePanel And this is my code.The problem is everything is ok but I cant see Loading.gif image .when code excatues Its wisible aspx page .What am i missing out here
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
<asp:Label ID="Label1" runat="server" Text=""></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
<img src="load.gif" />
</ProgressTemplate>
</asp:UpdateProgress>
</div>
You should have trigger in UpdatePanel like this:
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" />
</Triggers>
Try to use asp:Image:
<ProgressTemplate>
<asp:Image ID="loader" runat="server" ImageUrl="~/img/loader.gif" />
</ProgressTemplate>

modal popup extender not showing panel on button click

I'm trying to use a modal popup extender on my page so when I click a button, it must show a panel. Here is what I have:
<asp:UpdatePanel runat="server" ID="updPanel">
<ContentTemplate>
<ajaxToolkit:ModalPopupExtender ID="mpeEmailComplete" runat="server" TargetControlID="btnTesting"
PopupControlID="pnl" OkControlID="btnOk"
BackgroundCssClass="modalBackground">
</ajaxToolkit:ModalPopupExtender>
<asp:Panel ID="pnl" runat="server" style="display:none;">
<asp:UpdatePanel ID="udp" runat="server">
<ContentTemplate>
<asp:Panel runat="server" ID="pnlEmailComplete" Visible="false">
<asp:Label runat="server" ID="lblTest" Text="Testing testing testing"></asp:Label>
<asp:Button runat="server" ID="btnOk" Text="OK" />
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
<asp:Button runat="server" ID="btnTesting" Text="Testing"/>
</ContentTemplate>
</asp:UpdatePanel>
but i can't get the panel to popup when the button is clicked. Anybody know why?
Your innermost panel has Visible=false.
<asp:Panel runat="server" ID="pnlEmailComplete" Visible="false"> *(change here)*
So, when you press the TESTING button, the ModalPopupExtender correctly causes the outer panel to display, but it's displaying an invisible inner panel, hence you see nothing on screen.
<asp:Panel ID="pnl" runat="server" style="display:none;"> *(this is ok)*
To fix, just yank the Visible=false from the outer panel (pnlEmailComplete)
Hope that helps!
Do you have any JavaScript errors and is pnl.Visible=False; set on the server-side anywhere?
Make sure you have the AjaxControlToolkit referenced properly, NuGet is the easiest way to add the reference.
http://nuget.org/packages/ajaxcontroltoolkit
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="Btnshow" runat="server" Text="Show" OnClick="Btnshow_Click" />
<asp:Button ID="BtnTarget" runat="server" Text="Target" Style="display: none" />
<asp:TextBox ID="TextBox1" runat="server">
</asp:TextBox>
<input type="button" value="Get" onclick="abc()" />
<asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="BtnTarget"
PopupControlID="Panel1">
</asp:ModalPopupExtender>
<asp:Panel ID="Panel1" runat="server" BackColor="Black" Width="300px" Height="300px">
<asp:UpdatePanel ID="UpdatePanel2" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">
<ContentTemplate>
<asp:Button ID="BtnHide" runat="server" Text="Hide Button" OnClick="BtnHide_Click" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="BtnHide" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
</asp:Panel>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Btnshow" EventName="Click" />
</Triggers>
</asp:UpdatePanel>

2 asp:updatepanel and 2 asp:updateprogress controls

I'm using two asp:updatepanel and 2 asp:updateprogress for them. Update progress shows correctly when I never use AssociatedUpdatePanelID with them, but if I use AssociatedUpdatePanelID the Progress bar never shows.
<asp:UpdateProgress AssociatedUpdatePanelID="upMainPracticeCountry" runat="server" ID="UpdateProgress1">
<ProgressTemplate>
<img src="images/loading.gif" alt="loading..." /></ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdatePanel ID="upMainPracticeCountry" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="ddlMainPracticeCountry" EventName="SelectedIndexChanged" />
</Triggers>
<ContentTemplate>
<asp:DropDownList ID="ddlMainPracticeState" runat="server">
</asp:DropDownList>
</ContentTemplate>
</asp:UpdatePanel>
and the other update panel is
<asp:UpdateProgress runat="server" ID="up2" AssociatedUpdatePanelID="upPostalCountry">
<ProgressTemplate>
<img src="images/loading.gif" alt="loading..." /></ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdatePanel ID="upPostalCountry" runat="server" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="ddlPostalCountry" EventName="SelectedIndexChanged" />
</Triggers>
<ContentTemplate>
<asp:DropDownList ID="ddlPostalState" runat="server">
</asp:DropDownList>
</ContentTemplate>
</asp:UpdatePanel>
Not exactly sure what's going in but can you try setting AutoPostback="true" for the dropdown lists in the update panels?
http://www.codeproject.com/KB/ajax/UpdateProgress.aspx

Updateprogress not working with PostBackTrigger-ASP.NET

hi I'm having a problem with "Updateprogress" in ASP.NET . If i set the PostBackTrigger the progress loading image is not displayed but if i exclude the PostBackTrigger it's working. The code is as follows :
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<Triggers>
<asp:PostBackTrigger ControlID="Submit" />
</Triggers>
<ContentTemplate>
<asp:FileUpload runat="server" ID="Up"></asp:FileUpload>
<asp:Button runat="server" Text="Upload" ID="Submit" OnClick="Submit_Click" CausesValidation="false" />
<asp:UpdateProgress ID="upd" runat="server">
<ProgressTemplate>
<img alt="Checking Status" src="ajax-loader(2).gif" />
<%--<asp:Image runat="server" ImageUrl="~/ajax-loader(2).gif" ID="img" />--%>
</ProgressTemplate>
</asp:UpdateProgress>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>

Resources