Using UpdatePanel Triggers in C#


V4 Ajax Tutorials
Server Intellect Cloud Hosting

Using UpdatePanel Triggers in C#

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.

In AJAX, we can specify areas of a page to be refreshed without refreshing the whole page. For this, we use UpdatePanels, which also have the ability to make use of triggers. These triggers allow us to specify which control initiates a certain postback. We can choose to initiate a partial postback, or a full one.

I just signed up at Server Intellect and couldn't be more pleased with my Windows Server! Check it out and see for yourself.

In this example, we will look at how we can specify different controls to refresh the whole page, and parts of the page. We will create two UpdatePanels and see how we can refresh each of them as well as refresh the whole page with the triggers.

First, we will start off by adding the ScriptManager, if it's not already there, like so:

<asp:ScriptManager ID="ScriptManager1" runat="server" />

This will handle all of our AJAX calls for us, which makes it a lot easier to develop AJAX applications.
Next, we add the UpdatePanel controls:

<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />

<asp:UpdatePanel ID="UpdatePanel1" runat="server">

<ContentTemplate>
<asp:Label ID="lblTime2" runat="server" /><br />
<asp:Button ID="butTime2" runat="server" Text="Refresh Page" /><br />
</ContentTemplate>
</asp:UpdatePanel>
<br />

<asp:UpdatePanel ID="UpdatePanel2" runat="server">

<ContentTemplate>
<asp:Label ID="lblTime3" runat="server" /><br />
</ContentTemplate>
</asp:UpdatePanel>
</form>

Server Intellect assists companies of all sizes with their hosting needs by offering fully configured server solutions coupled with proactive server management services. Server Intellect specializes in providing complete internet-ready server solutions backed by their expert 24/365 proactive support team.

Each UpdatePanel has its own ContentTemplate, which is the area that will be refreshed upon an Asynchronous postback. We have included a label in each content, and will use the code-behind to display the current time. This will allow us to easily see what area of the page is being refreshed - we will also put a label and a button outside of the UpdatePanels so that we can see when the whole page is being refreshed - independent from the Panels.

We will use the button outside of the UpdatePanel to refresh the panel, and the button within the UpdatePanel to refresh the whole page. By default, a postback called within an UpdatePanel will be hijacked by AJAX. Using triggers, we can have more control.
We add another label and a button:

<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />

<asp:Label ID="lblTime1" runat="server" /><br />
<asp:Button ID="butTime1" runat="server" Text="Refresh Panel" /><br /><br />

<asp:UpdatePanel ID="UpdatePanel1" runat="server">

<ContentTemplate>
<asp:Label ID="lblTime2" runat="server" /><br />
<asp:Button ID="butTime2" runat="server" Text="Refresh Page" /><br />
</ContentTemplate>
</asp:UpdatePanel>
<br />

<asp:UpdatePanel ID="UpdatePanel2" runat="server">

<ContentTemplate>
<asp:Label ID="lblTime3" runat="server" /><br />
</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.

Now that we have a label and button on our page, and also in each UpdatePanel, we will add the code-behind:

protected void Page_Load(object sender, EventArgs e)
{
lblTime1.Text = DateTime.Now.ToString("T");
lblTime2.Text = DateTime.Now.ToString("T");
lblTime3.Text = DateTime.Now.ToString("T");
}

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.

This simply sets the current time to the labels we created when the page is loaded. This will also run when a partial postback is performed.

Buttons are not the only control we can use for triggers. We will also add a DropDownList:

<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />

<asp:Label ID="lblTime1" runat="server" /><br />
<asp:Button ID="butTime1" runat="server" Text="Refresh Panel" /><br /><br />

<asp:UpdatePanel ID="UpdatePanel1" runat="server">

<ContentTemplate>
<asp:Label ID="lblTime2" runat="server" /><br />
<asp:Button ID="butTime2" runat="server" Text="Refresh Page" /><br />
</ContentTemplate>
</asp:UpdatePanel>
<br />

<asp:UpdatePanel ID="UpdatePanel2" runat="server">

<ContentTemplate>
<asp:Label ID="lblTime3" runat="server" /><br />
</ContentTemplate>
</asp:UpdatePanel>

<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="true">
<asp:ListItem>Change</asp:ListItem>
<asp:ListItem>My</asp:ListItem>
<asp:ListItem>Value</asp:ListItem>
</asp:DropDownList>
</form>

Finally, we can add the triggers. We will use the button outside of the UpdatePanels to reload them, and the button inside the first Panel will reload the page. The DropDownList will reload the Panels:

<Triggers>
<asp:AsyncPostBackTrigger ControlID="butTime1" EventName="Click" />
<asp:PostBackTrigger ControlID="butTime2" />
</Triggers>
..
<Triggers>
<asp:AsyncPostBackTrigger ControlID="DropDownList1" EventName="SelectedIndexChanged" />
</Triggers>

Need help with Windows Dedicated Hosting? Try Server Intellect. I'm a happy customer!

The ASPX page will now look something like this:

<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />

<asp:Label ID="lblTime1" runat="server" /><br />
<asp:Button ID="butTime1" runat="server" Text="Refresh Panel" /><br /><br />

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="butTime1" EventName="Click" />
<asp:PostBackTrigger ControlID="butTime2" />
</Triggers>

<ContentTemplate>
<asp:Label ID="lblTime2" runat="server" /><br />
<asp:Button ID="butTime2" runat="server" Text="Refresh Page" /><br />
</ContentTemplate>
</asp:UpdatePanel>
<br />

<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="DropDownList1" EventName="SelectedIndexChanged" />
</Triggers>

<ContentTemplate>
<asp:Label ID="lblTime3" runat="server" /><br />
</ContentTemplate>
</asp:UpdatePanel>

<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="true">
<asp:ListItem>Change</asp:ListItem>
<asp:ListItem>My</asp:ListItem>
<asp:ListItem>Value</asp:ListItem>
</asp:DropDownList>
</form>

Download Project Source - Enter your Email to be emailed a link to download the Full Source Project used in this Tutorial!



100% SPAM FREE! We will never sell or rent your email address!
 


Comments
rafiqe said:

i want to know how to create master page on windows form using c#. i know how to use in asp.net but i want to create a windows application form

Posted Sep 9, 2008 2:17 AM
rafiqe said:

i want to know how to create master/home page in windows apllication form. i know that how to use in asp.net but i want to create in windows application.

Posted Sep 9, 2008 2:19 AM
Azamat said:

I don't think we have the concept of master/home page in the windows application form. The structure of web programming and windows programming is different.

Master pages are not available in Windows programming.

Posted Oct 9, 2008 4:51 PM
Shai said:

Nice Article

Posted Oct 9, 2008 5:46 PM
Manoj said:

Nice Articles

Posted Oct 10, 2008 12:20 AM
Rajeev said:

Rafique,

You can have the look and feel like that by inheriting all forms you from a base form with common features.

There is no concept like Master page in windows forms as Azmat said.

Posted Oct 10, 2008 2:19 AM
kshitij kumar said:

There is no such concept like master page in the Windows applications as these applications follows the concept of Forms (dialog box), if you want to use the functionality liek the Master page of ASP.net then you should use the concept of MAster and Child form. Under which there will be one master(Parent) form and all the other forms will act as their child under the master form area

Posted Oct 14, 2008 9:01 AM
raha said:

1. What are the new Data Controls in Asp.net 2.0?

Data access in ASP.NET 2.0 can be accomplished completely declaratively (no code) using the new data-bound and data source controls. There are new data source controls to represent different data backends such as SQL database, business objects, and XML, and there are new data-bound controls for rendering common UI for data, such as gridview, detailsview, and formview.

2. What are the new Navigation Controls in Asp.net 2.0?

The navigation controls provide common UI for navigating between pages in your site, such as treeview, menu, and sitemappath. These controls use the site navigation service in ASP.NET 2.0 to retrieve the custom structure you have defined for your site.

3. What are the new Login Controlsin Asp.net 2.0?

The new login controls provide the building blocks to add authentication and authorization-based UI to your site, such as login forms, create user forms, password retrieval, and custom UI for logged in users or roles. These controls use the built-in membership and role services in ASP.NET 2.0 to interact with the user and role information defined for your site.

4. What are the new Web Part Controls in Asp.net 2.0 ?

Web parts are an exciting new family of controls that enable you to add rich, personalized content and layout to your site, as well as the ability to edit that content and layout directly from your application pages. These controls rely on the personalization services in ASP.NET 2.0 to provide a unique experience for each user in your application.

5. What are Master Pages?

This feature provides the ability to define common structure and interface elements for your site, such as a page header, footer, or navigation bar, in a common location called a "master page", to be shared by many pages in your site. In one simple place you can control the look, feel, and much of functionality for an entire Web site. This improves the maintainability of your site and avoids unnecessary duplication of code for shared site structure or behavior.

6. What are Themes and Skins in 2.0, explain usgae scenario?

The themes and skins features in ASP.NET 2.0 allow for easy customization of your site's look-and-feel. You can define style information in a common location called a "theme", and apply that style information globally to pages or controls in your site. Like Master Pages, this improves the maintainability of your site and avoid unnecessary duplication of code for shared styles.

7. What is a profile object, why is it used?

Using the new personalization services in ASP.NET 2.0 you can easily create customized experiences within Web applications. The Profile object enables developers to easily build strongly-typed, sticky data stores for user accounts and build highly customized, relationship based experiences. At the same time, a developer can leverage Web Parts and the personalization service to enable Web site visitors to completely control the layout and behavior of the site, with the knowledge that the site is completely customized for them. Personalizaton scenarios are now easier to build than ever before and require significantly less code and effort to implement.

8. What is Configuration API?

ASP.NET 2.0 contains new configuration management APIs, enabling users to programmatically build programs or scripts that create, read, and update Web.config and machine.config configuration files.

9. What is MMC Admin Tool?

ASP.NET 2.0 provides a new comprehensive admin tool that plugs into the existing IIS Administration MMC, enabling an administrator to graphically read or change common settings within our XML configuration files.

10. Explain the use of Pre-compilation Tool?

ASP.NET 2.0 delivers a new application deployment utility that enables both developers and administrators to precompile a dynamic AS

Posted Oct 15, 2008 3:30 AM
NIcsam said:

Hi

This is a very nice article.Simple,easy to understand

Regards

Nicsam

Posted Oct 17, 2008 7:46 AM
martin said:

I'm using Smartpart with Ajax to upload usercontrols in Sharepoint. I have a gridview with multiple Linkbuttons. When I run the code from a webform it works perfectly. When I upload the usercontrol in sharepoint none of the Linkbuttons work. I click them and nothing happens. What can I do to resolve this?

Posted Nov 6, 2008 12:46 PM
vibhash said:

How to use Ajax in Visual Studio 2008.

Posted Nov 7, 2008 6:03 AM
mani said:

nice

Posted May 21, 2009 1:31 AM
Loran said:

LOL Joe - I agree. Funny as heck.

Posted May 27, 2009 10:15 AM
how we use ajax updatepannel in .net version 2.0 said:

i am add ajax tool kit but there are not updatepannel control is avilable. what i am doing........

Posted Oct 15, 2010 5:23 AM
The Admin said:

Are you sure you added the AJAX toolkit correctly? what version of Visual Studio are you using? It should be in your AJAX Extension toolbox.

Posted Oct 19, 2010 6:39 PM
vijay parmar said:

hi..

Posted Oct 30, 2010 10:18 AM
Freelance SEO India said:

India’s leading Freelance SEO India services provider with main competency in Search Engine Optimization of websites.

Posted Dec 29, 2010 10:17 PM
Shafiqur Rahman said:

how to remove double click in update panel

Posted Jan 31, 2011 4:14 AM
sagar said:

its too good......i cna easily under stand.......how AJAX use.......thanks a lot.......

Posted Apr 23, 2011 2:53 PM
www.gucci2you.com said:

www.gucci2you.com

Posted Aug 6, 2011 3:40 AM
Vishnu said:

It's too good for understood update panels action on trigger.

Anybody can easily get how to use it.

Posted Aug 24, 2011 1:37 AM
efds said:

ewerwer

Posted Sep 19, 2011 3:13 AM
coach bags said:

coach bags

generally variety within the buying price of $120.00 in order to $450.00, however they perform possess little purses as well as scarfs which are below $100.00.Coach bags, purses and other accessories can definitely add a touch of class to every woman.

coach outlet store

sells Coach products which are moderately priced and yet of good quality.

Posted Feb 12, 2012 8:20 PM
AProspectiveCustomer_NOT said:

Wow, I would totally trust a hosting company that hacked other sites to do their advertising. Nice going "Server Intellect". Get some!

Posted Mar 12, 2012 2:50 PM
TN Pas Cher said:

You know it is really inspirational for those people who need that. For example

Posted Apr 16, 2012 10:15 PM
عالم حواء said:

Write more, that’s all I have to say. Literally, it seems as though you relied on the video to make your point. You clearly know what you’re talking about, why waste your intelligence on just posting videos to your blog when you could be giving us something enlightening to read

Posted May 9, 2012 9:06 AM
Supra Skytop For Kids said:

. Supra shoes and boots try to manufacture fresh in addition to realistic classics with regard to people which demand details in addition to excellent. Supra boots or shoes system is actually inspired, passionate company endorsed by just a particular person.199001014911

Posted May 19, 2012 3:13 AM
sinful bikini said:

Bikini - Tips on Buying Bikini Online

You can do all of your searching without ever having to deal with the pesky sales people who can be rather pushy Bikini Sale when trying to get you to buy something.Womens Swimwear Shop Take your measurements before you get ready to place your order.199001014911

Posted May 19, 2012 3:15 AM
Onitsuka Tiger said:

Victory won’t come to me unless I go to it.

Posted Aug 20, 2012 5:11 AM
Reshma said:

nice article

Posted Sep 11, 2012 2:13 AM
hhh said:

<p>Today he really considers <a href="http://www.redbottomscheapsales.net/">Red Bottom Shoes</a> photo journalism and film making to be his fortes and the areas that he wants to focus on more than acting. <a href="http://www.redbottomscheapsales.net/">Cheap Christian Louboutin</a> It is within these areas that he really excels at raising awareness and generating thought provoking material for audiences to <a href="http://www.redbottomscheapsales.net/Christian-Louboutin-Pumps/">Christian Louboutin Pumps</a> really enjoy. He still steps in front of the cameras from time to time to take part in movies and shows. </p>

Posted Oct 22, 2012 9:02 PM
cheap hermes handbags outlet said:

Instead of gaudy gold hoop earrings, glittery hairbands and acres of strappy sequinned embellishment, high street fashion seems to have gone more feminine. Cute floral hairclips, pretty ballet pumps and dresses with sleeves seem to have replaced the more in your face alternatives of seasons past.

Posted Jan 8, 2013 12:15 AM
stone artt gemsstones said:

It is interested article i have ever read.

stoneArtt is Import Export Company of gemstones , who sold it product across World.

Posted Jan 8, 2013 2:00 AM
ta-65 supplement said:

Hi my loved one! I wish to say that this post is amazing, nice written and include almost all significant infos. I would like to peer extra posts like this .

Posted Mar 18, 2013 5:04 AM
ta-65 supplement said:

Hi my loved one! I wish to say that this post is amazing, nice written and include almost all significant infos. I would like to peer extra posts like this .

Posted Mar 18, 2013 5:06 AM
Asics Tiger said:

A full belly counsels well.

Posted Mar 30, 2013 11:29 AM
replica watches australia said:

This is exactly this really important and fascinating subject.

Posted Apr 7, 2013 11:38 AM
Punggol EC said:

Ecopolitan EC has full and unique facilities, which includes a guard house, clubhouse, Function Room & Indoor Gym Tennis Court, 50m Freeform Pool Pool Deck, Wading Pool, Splash Pool & Family Pool Jacuzzi & Hydro Spa, BBQ Area Dining and Play Fountain, Fitness Alcove & Children’s Playground and Garden Trail. The condo’s facilities provide full family entertainment needs for your family and loved ones. Indulge in a serene and tranquil lifestyle right in the heart of Punggol.

Posted May 1, 2013 4:57 AM

Leave a Comment