Using User Controls in ASP.NET 2.0 and C#

This tutorial will show how we can create a User Control to use as navigation and include it on multiple pages. C# version.

User Controls within ASP.NET have many uses. One of them is the ability to nest pages or scripts within others; a modern version of Server-Side Includes, and a more advanced version of using frames. One of the main advantages of using User Controls is that we can implement them on multiple pages and then when only need to change it in one file, and the change replicates throughout the site. For example, we could create a User Control for our navigation menu and implement it on all the pages on our site, and they would all be exactly the same. Then if we needed to add another page to the navigation, we'd only have to do it once and the changes would be made on all pages.

Server Intellect offers Windows Hosting Dedicated Servers at affordable prices. I'm very pleased!

This tutorial will show how we can create and implement User Controls in an ASP.NET Web Application. We will be creating a simple navigation menu, and implementing it on mutliple pages.
We will start by creating our Default.aspx page and the in the Solution Explorer, we can right-click our project and choose Add New Item.. Web User Control. You can name it what you like, but make it easy to remember, as we'll need to reference it. The User Control will be an ASCX file, and from the Solution Explorer, we will be able to drag the control onto our ASPX pages in Design View. This will create the following code at the top of the ASPX page. Also, instead of dragging & dropping, we can type directly into the code:

<%@ Register Src="Menu.ascx" TagName="Menu" TagPrefix="uc1" %>

This piece of code references the Control so we can use it in our page. Then we place the following where we want the Control to appear on our page:

<uc1:Menu ID="Menu1" runat="server" />

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.

We can have multiple User Controls on one page, and they will have different prefixes, like uc1, uc2, uc3, etc.
Now, let's create two more ASPX pages, and repeat the above process to add the User Controls onto those pages, too. In this example, we have Default.aspx, Page1.aspx, Page2.aspx and Menu.ascx
The code for the User Control is as follows:

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="Menu.ascx.cs" Inherits="Menu" %> <asp:HyperLink ID="lnkHomePage" runat="server" NavigateUrl="~/Default.aspx" Text="Home"></asp:HyperLink> | <asp:HyperLink ID="lnkPage1" runat="server" NavigateUrl="~/Page1.aspx" Text="Page 1"></asp:HyperLink> | <asp:HyperLink ID="lnkPage2" runat="server" NavigateUrl="~/Page2.aspx" Text="Page 2"></asp:HyperLink>

Try Server Intellect for Windows Server Hosting. Quality and Quantity!

The first line is similar to the Page directive in an ASPX page. The User Control has its own code-behind, so it can have its own methods and logic. The rest of the code is a simple navigation menu to the other pages.
Page 1 and Page 2 will look something like this:

<form id="form1" runat="server"> <div align="center"> <uc1:Menu ID="Menu1" runat="server" /><br /> This is Page 1. </div> </form>

<form id="form1" runat="server"> <div align="center"> <uc1:Menu ID="Menu1" runat="server" /><br /> This is Page 2. </div> </form>

Each of these pages also have the @ Register directive at the top of the page, just under the @ Page directive. If we now run Default.aspx, we will see that the page displays as if one - the menu shows up as if it is part of the document. We know it is a separate document, but the end user will not know - it doesn't display any different. You can click on the links to the other pages, also, and the menu will appear the same.

Looking for more ASP.NET Tutorials? Click Here!