Using placeholder controls in asp.net

When you convert from one Web page to another, some parts of your asp.net application's user interface often remain unchanged-for example, some "trim" parts: a GIF picture at the header, a horizontal toolbar or navigation bar, a link to the left, and so on. You can continue to use them instead of rebuilding each page.

In the past, a popular ASP technology was to create an include file for each major part of a page, and then build a whole HTML table with each include file in the table's cells. This method is feasible, but not beautiful, and error prone. Luckily, ASP. NET allows you to solve this problem in a better way, using a visual Studio. NET placeholder Web control. The control includes other controls as a collection (collection). You can clear that collection at run time or add it; For example, you can add a Web user control (a modular Web page) at run time. I'll tell you how to combine placeholder Web controls with Web user controls to provide a way to build asp.net applications.

First, create a new asp.net Web application in vs.net. I use C # in the sample code. Create a Web form with an ASPX extension for the saved file. I call it my main.aspx. This page is the only Web page in your application, because you use a Web user control (ascx file) to develop all the page "content."

Create the site decorations you selected in the Main.aspx page. Add a placeholder control where you want to place the rich content of your site. Then, add the following code to the page load event for your pages:

private void Page_Load(object sender,
System.EventArgs e)
{
string p = Request.QueryString.Get("p");
PlaceHolder1.Controls.Clear();
if (p == null)
PlaceHolder1.Controls.Add(LoadControl
("modules/" + "Default" + ".ascx"));
else
{
PlaceHolder1.Controls.Add(LoadControl
("modules/" + p + ".ascx"));
}
}

With this code, you can see a query string parameter P in the Project module folder that contains the name of the Web User Control page (ASCX). You don't have to put all the ascx files in a separate folder, but doing so can further isolate the application.

Once you get that string, empty the placeholder Controls collection and clear any ascx you may have previously displayed. Then, look at the code to see if you need to load a default ascx. Finally, if the P query string is part of the request, the page represented by the P query string is loaded.

You don't need a lot of effort building code to display multiple Web pages on your site. Add a new Web User control page to your vs.net project. Once you add this page, you can design and write code as the only page in your application, and you don't even need to know it will run on the Main.aspx page. Of course, if the page needs to interact with the main page, it's not that simple, but I'm not going to tell you about it here.

Figure 1. Maintain the constant elements of your web GUIs

Imagine that you need to display an account logon user control in the Vs.net development environment (see Figure 1).

The code gives developers only the UI that is relevant to the details of the page. There is no way to change other aspects of the overall page.

Now, when you run http://localhost/CSCSdotNET/main.aspx in a browser, the Default.ascx page is loaded first, due to the Main.aspx page load event. To navigate to the login page, you simply add a p query string parameter to the request--in this case, using the URL http://localhost/CSCSdotNET/main.aspx p=01-accountlogon. The whole main.aspx page is now displayed, along with the dynamically loaded 01-accountlogon.ascs Web user control you see in Figure 1.

About the Author:

Marc Gusmano Information Management Group (www.imginc.com) is primarily responsible for the research of emerging technologies, the company is Microsoft Gold Certified Partner (Gold Qualification partner). Marc is focused on using COM + and. NET to design, implement distributed and e-business solutions. He gave a speech at the conference and managed the Microsoft Internet developers Group in Chicago in Chicago. His contact method is gusmanomarc@imginc.com.