Custom Controls

Now that you have the application built it might be nice to add some user controls to navigate the application. It would also be nice if we could implement templates for the design elements. Custom controls are our answer. ASP.NET controls are referenced as objects with properties (Beginning to sense an Object Oriented pattern?) and can consist of almost anything: html, style formatting, intricate code. Our custom controls will all consist of html.

Adding Controls

Controls in ASP.NET’ are similar to includes in Classic ASP. The main difference is that controls are referenced as objects whereas the content includes are added to the page they appear on. The syntax for accessing controls is again object oriented. As objects controls have properties. In order to access the control, the first thing we have to do is add a reference to the control and describe its properties. We do this by adding the Register Tag to the top of our page like so:

<%@ Register TagPrefix="DotNetNews" TagName="yourtagname" Src="path/filename.ascx" %>

Now all we have to do is declare instances of the control object wherever we need it. A control is declared using the following syntax:

<DotNetNews:Security ID="yourtagname1" runat="server" />

ASP.NET controls turn out to be lot more familiar that we expected, kind of like includes on steroids. Before we end the tutorial we will cover one more use of controls: templating.

Using Custom Controls as Templates

This is so far the best way I’ve found to implement skins or templates on an ASP.NET site. First thing to do is design your template. Now in the spot where you want to display the dynamic content enter XXX. We will use the XXX marker to split the design template into halves that we reassemble on page run. Once you have your template just as you like it save it as a regular htm file, but don’t close it. Now open a new file. Enter code view, select and delete all the html. Add the <%@ Control %> tag to the top of the page and save it as “/controls/front_header.ascx.”

Switch to the template we just created and enter code view again. Find the XXX marker we made earlier. Now select all the markup from the top of the page down to the closing “>” of the last tag before the XXX. Paste this into the “/controls/front_header.ascx” file you just created and save that file. Repeat the procedure and save that file as “/controls/front_footer.ascx.” Now all you have to do is add the register tag to the top of the pages you want to use the controls in and declare the control where it appears. The controls top.ascx, bottom.ascx, and men_left.ascx control the back end look and navigation.

That’s it! You’ve built your first DWMX ASP.NET application. As you can see a lot UD4 features for creating Classic ASP applications are not available in DWMX. Certainly part of this is due to the short amount of time MM had to implement ASP.NET support in this release. I expect the next DreamWeaver version will to offer much more support for creating ASP.NET pages. Also as ASP.NET becomes more popular, we can expect increasing numbers of ASP.NET extensions. As it stands DWMX is an excellent tool for creating ASP.NET applications and promises to get better as time passes.           

Useful Links

This short list of links should help get you started with ASP.NET. The MS Web Matrix Project software is worth downloading. It contains some useful templates, links to ASP.NET documentation and the Class Browser—very useful for learning about ASP.NET classes.

http://dnzone.com/
http://asp.net/Tutorials/quickstart.aspx
http://asp.net/webmatrix/default.aspx
http://support.microsoft.com/default.aspx?scid=fh;en-us;aspnet
http://msdn.microsoft.com/library/default.asp?url=/library/en-us/vbcon98/html/vbconwelcometovisualbasic.asp