This tutorial was created with Visual Studio.NET 2008. 2005 can be used, but Microsoft's ASP.NET AJAX Extensions, which can be downloaded at this link, must be installed.
Using AJAX in ASP.NET, we are able to programmatically force an UpdatePanel to Update - we do not have to rely solely on triggers. Similarly, we are able to stop an UpdatePanel from updating if certain criteria is not met.
We chose Server Intellect for its dedicated servers, for our web hosting. They have managed to handle virtually everything for us, from start to finish. And their customer service is stellar.
In this tutorial, we will be looking at how we can programmatically make an UpdatePanel update when certain criteria is met. We will be using an UpdatePanel to display the current time, and we'll also have a textbox and a button, which we'll use to require the user to enter a string before the UpdatePanel is updated.
The first thing we will do is build our ASPX page. First, we will add the ScriptManager tag, if it has not already been added for us:
| <form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
</form> |
We used over 10 web hosting companies before we found Server Intellect. Their dedicated servers and add-ons were setup swiftly, in less than 24 hours. We were able to confirm our order over the phone. They respond to our inquiries within an hour. Server Intellect's customer support and assistance are the best we've ever experienced.
The ScriptManager will handle all the AJAX calls for us; ASP.NET makes it really easy for us to implement and use AJAX. We also need to add the UpdatePanel:
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
</ContentTemplate>
</asp:UpdatePanel>
</form> |
If you're ever in the market for some great Windows web hosting, try Server Intellect. We have been very pleased with their services and most importantly, technical support.
Because we will be programmatically updating the UpdatePanel, we need to set two attributes - UpdateMode and ChildrenAsTriggers. We do not want the UpdatePanel to Update all the time (hijack all PostBacks), so we set this to Conditional. We also do not want to specify the child controls of the UpdatePanel as triggers, causing it to update, also. So our UpdatePanel will look like this:
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false">
<ContentTemplate>
</ContentTemplate>
</asp:UpdatePanel>
</form> |
If you're looking for a really good web host, try Server Intellect - we found the setup procedure and control panel, very easy to adapt to and their IT team is awesome!
Now we can add the controls to our ContentTemplate:
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false">
<ContentTemplate>
Time now: <%= DateTime.Now.ToString("T") %>
<br /><br />
Please type Update in the textbox, and hit the button:<br />
<asp:TextBox ID="txtUpdate" runat="server" /><br />
<asp:Button ID="butUpdate" runat="server" Text="Update"
onclick="butUpdate_Click" />
</ContentTemplate>
</asp:UpdatePanel>
</form> |
We moved our web sites to Server Intellect and have found them to be incredibly professional. Their setup is very easy and we were up and running in no time.
Notice we have the button onclick attribute set to call a method. The method will look something like this:
protected void butUpdate_Click(object sender, EventArgs e)
{
if (txtUpdate.Text == "Update")
UpdatePanel1.Update();
} |
I just signed up at Server Intellect and couldn't be more pleased with my Windows Server! Check it out and see for yourself.
If the user followed the instructions, the UpdatePanel will refresh; but if the user made a mistake, the UpdatePanel will not update.
The entire code-behind looks like this:
using System;
using System.Configuration;
using System.Data;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void butUpdate_Click(object sender, EventArgs e)
{
if (txtUpdate.Text == "Update")
UpdatePanel1.Update();
}
} |
To download this project, enter your email address and a link will be emailed to you.