| You may want to have the navigation list, shown on the left in Figure 21.3, on more than just the main page in your application. You might want to display the list of links on the left, with content filling the rest of the page. To accomplish this goal, you might create a table on each page, with the navigation information in the first column and the rest of the content filling the second column of the table. In addition, it seems like a user control would be the simplest way to use the same set of links on all the pages of your application. In this section, you'll create a new user control containing all the links from Main.aspx and then modify Main.aspx to take advantage of the new user control. Along the way, you'll see how to create a simple table on a page. Follow these steps to create your user control: -
Open Main.aspx in the page designer. -
Select all the links on the page, including the Label control separating the two groups of links. TIP To select all the links, you may find it easiest to click the page at the lower-right corner of the links and then drag up to the upper-left corner until all the links are selected. -
Press Ctrl+X to cut the controls to the Windows Clipboard. -
Select the Project, Add Web User Control menu item. Name the new user control NWLeftNav.ascx. Click Open. -
With the new user control open in the page designer, press Ctrl+V to paste the controls onto the new control. -
In the Solution Explorer window, right-click Main.aspx and select View Code from the context menu. -
Select the Page_Load and lnkLogout_Click procedures and press Ctrl+X to cut the procedures to the Clipboard. -
In the Solution Explorer window, right-click NWLeftNav.ascx and select View Code from the context menu. -
In the code window, select and delete the existing Page_Load procedure and then click Ctrl+V to paste the code you cut from Main.aspx. -
Save the project and close all the designer windows. Now that you've created the navigation control, add it to Main.aspx: -
Load Main.aspx in the page designer. -
Click the page, immediately below the existing NWHeader user control. -
Select the Table, Insert, Table menu item. -
On the Insert Table dialog box, set the BorderSize property to 0, the Rows property to 1, and the Columns property to 2. Click OK to insert the new table. -
From the Solution Explorer window, click and drag NWLeftNav.ascx into the left column of the table. -
Run the project and verify that Main.aspx looks and works just as it did before you added the user controls. TIP You added the navigation user control to a table in this exercise. Why bother? If you want to use the navigation control on the same page as normal content, you'll often want to use the second column of the table to display the rest of the content for the page. This way, no content on the page will "wrap" into the area where the navigation list displays, and the columns of the table can stretch as far, vertically, as necessary.
|
