Partial page refresh using an UpdatePanel - asp.net

I have a page associated with master page. I need to implement the Ajax(basically wanted to to do partial page refresh).
In this page I have grid and paging buttons(first/previous/last/next), dropdowns and also search.
So all these updates the grid.
Right now I have below code
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
under
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
Here is the html like grid/buttons/search after ContentTemplate tag starts
So finally the page has left menu/footer/header and contents
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>
But this is still refreshing the page.

I am a little confused as to you have and what you want.
It sounds like you have a Content control with an UpdatePanel in it. Within the UpdatePanel ContentTemplate you have all your grid, buttons etc along with your menu.
You only need to have the controls that you want to do the refresh in your UpdatePanel ContentTemplate. All the other stuff you should have outside of the UpdatePanel. If you have any controls outside of the UpdatePanel that you need to trigger a refresh with setup a Trigger for each control in the UpdatePanel and tell it which event to trigger off of.
Example:
<asp:Button ID="btnTest" runat="server" Text="Test" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<!-- only your content that needs refreshing goes here -->
<ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnTest" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
In the above example the btnTest click event will cause the content of the UpdatePanel to refresh but the Button or anything outside of the UpdatePanel will not refresh. If the Trigger was not setup, the whole page would refresh. You don't need Trigger setup for controls within an UpdatePanel as all control events will be captured by the UpdatePanel for a refresh.
You can read up more on MSDN.

Related

ASP.NET update panel nested refreshing

This code is in a user control . and i am providing a sample code structure to get an overview .
<Update Panel UpdateMode= "Conditional">
<panel></panel>
<panel>
<button></button>
</panel>
<updatepanel UpdateMode="Conditional"></updatepanel>
</Updatepanel>
so when i click a button in the second panel , i am supposed to hide that panel and it is happening but simultaneously the other panels are getting refreshed . what could be the possible reason for that ?
Based on the code snippet you may have a couple issues to fix:
Make sure you have a ScriptManager on the page with EnablePartialRendering="true"
Correct your markup by making the <UpdatePanel> elements ASP.NET UpdatePanel controls by prefixing them with "asp:".
Add UpdateMode="Conditional" to both of your UpdatePanel controls
Move the sections you want to update asynchronously into the UpdatePanel controls.
Example
<asp:ScriptManager ID="MyScriptManager" EnablePartialRendering="true" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="MyUpdatePanel" runat="server">
<ContentTemplate>
<asp:Label ID="Label1" runat="server" Text="This is a label!"></asp:Label>
<asp:Button ID="Button1" runat="server" Text="Click Me" />
</ContentTemplate>
</asp:UpdatePanel>
The following article is a great resource to learn more about the UpdatePanel with details on it's capabilities.
Understanding Partial Page Updates with ASP.NET AJAX

UpdateProgress not showing on first postback

I am working on an app that loads modules (which are just user controls) into a single update panel. UpdateMode="Always". There is an UpdateProgress control with a gif that should display on postback.
For a few modules, the UpdateProgress doesn't show until the second postback from the module. So for example, the one module has a dropdown that posts back on change. If the user changes the dropdown before doing anything else, there will be no indication (no progress gif) that it is posting back. If the user then changes the drop down again (or any other postback), the UpdateProgress shows. Any ideas?
I've verified that it isn't just the drop down control and the initial postback takes long enough that the progress gif should show. UpdatePanel code below, module user controls are loaded in cphMain.
I am currently working around this by doing a __doPostBack in JavaScript when the module loads, but this is ugly.
<asp:UpdatePanel ID="upMain" runat="Server" UpdateMode="Always">
<ContentTemplate>
<asp:UpdateProgress ID="uPrgMain" runat="server" AssociatedUpdatePanelID="upMain">
<ProgressTemplate>
<h4>
<asp:Image ID="imgLoading" runat="server" ImageUrl="~/images/loading.gif" AlternateText="Loading" />
Loading...</h4>
</ProgressTemplate>
</asp:UpdateProgress>
<asp:ContentPlaceHolder ID="cphMain" runat="server">
</asp:ContentPlaceHolder>
</ContentTemplate>
</asp:UpdatePanel>

ASP.NET USERCONTROL WITH UPDATE PANEL INSIDE PAGE UPDATE PANEL

I have a master page with the Scrip manager. Have one page that use the master page and inside of this page i have an updatepanel. Inside this update panel i call a UserControl that have inside other updatepanel.
So i have,
MasterPage ->
Page with updatepanel ->
UserControl with update panel
The problem is that the linkbutton event inside the usercontrol updatepanel not fires.
Any help?
<asp:UpdatePanel ID="updPost" runat="server" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="linkComment" EventName="Click" />
</Triggers>
<ContentTemplate>
<asp:LinkButton ID="linkComment" runat="server"
OnClick="linkComment_Click"
CssClass="PostComment" Text="Comment" />
</ContentTemplate>
</asp:UpdatePanel>
This is the code of usercontrol.
Thanks
It looks like showCommentBox() is not returning true.

asp.net ajax update panel confusion

Well, i have this in my master page
<cc1:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" ScriptMode="Release" />
And this in a usercontrol
<asp:UpdateProgress ID="updateProgress1" runat="server" AssociatedUpdatePanelID="CustomerListUpdatePanel" DisplayAfter="0" DynamicLayout="false">
<ProgressTemplate>
<asp:Literal ID="loadingLiteral" runat="server" Text="<%$resources:Label,Loading %>" />
</ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdatePanel id="CustomerListUpdatePanel" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="SearchButton" EventName="Click" />
</Triggers>
<ContentTemplate>
<asp:repeater id="CustomerListRepeater" runat="server">
Problem here is that when i press the SearchButton the update panel updates but the UpdateProgress does not show it self, even if it takes a few seconds.. [somewhat solved by Yuriy Rozhovetskiy].
Problem is that the child buttons inside the updatepanel do not cause a total postback, instead they only reload the update panel, so it seems ChildrenAsTriggers="false" does not work or im miss understanding it.
Im using AjaxControlToolkit 4.1.50731.0.
Edit: also the UpdateProgress seems to display it self if a button is pressed inside the update panel...
Associating an UpdateProgress with an UpdatePanel Control:
The AssociatedUpdatePanelID property has the following effect on
UpdateProgress control behavior:
When the AssociatedUpdatePanelID property is not set, the
UpdateProgress control is displayed for the following postbacks:
Postbacks that originate from inside any UpdatePanel control.
Postbacks that originate from controls that are asynchronous
triggers for any UpdatePanel control.
When the AssociatedUpdatePanelID property is set to an UpdatePanel
control ID, the UpdateProgress control is displayed for postbacks
that originate from inside the associated UpdatePanel control.
Not sure about #Problem 1.
Regarding #Problem 2... I think your understanding might not be correct.
http://msdn.microsoft.com/en-us/library/system.web.ui.updatepanel.childrenastriggers.aspx

how to remove page reload

In my application when we click on add button a Modal PopUp Extender appears in that their are 2 asp button Save and Cancel. When we click on these buttons the page gets reloaded i have to stop it.
Plz help ..
Use Ajax. How you go about this depends wholy on your design. Without Ajax, you need to post the page and have it reload. Ajax still performs the posting of the data, but it's behind the scenes from the user point of view, and you need to write scripts to handle the response.
You can add an UpdatePanel to your aspx-markup and set the buttons as AsyncPostbackTriggers, this will cause only the content of the popup to reload, not the complete page.
The result will look something like this:
<asp:ScriptManager ID="sm1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="up1" ChildrenAsTriggers="true" runat="server" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="submitButton" EventName="Click" />
</Triggers>
<ContentTemplate>
<!--popup-->
</ContentTemplate>
</asp:UpdatePanel>

Resources