ASP.NET Secrets, Part 1
Welcome to part one of ASP.NET Secrets!
I'm Karl Moore and over the next five articles, I'll be exploring a bundle of neat tips and tricks to put your Web applications into overdrive. Today, we'll be looking at:
- Displaying Web Warning Messages: Technique 1
- Displaying Web Warning Messages: Technique 2
- Unveiled: How to Create a Default 'Enter' Button!
- Wonders of the Little-Known SmartNavigation Property
- The Secret Behind User Controls
Ready to get started? Let's dive into those juicy secrets...
Displaying Web Warning Messages: Technique 1
One of the problems in trying to dish out warnings on a Web page is that it's all very passive. Not awfully in-your-face. You can't always force a reaction, as you can with a Windows application.
- Switch to the HTML view of your Web form and add the following immediately after the close of the <body> tag:
- Switch back to Design view and save your Web form. This has set up your Literal server control manually—due to the surrounding <script> tags; we couldn't do this using the designer.
- Enter the code window behind your Web form and add the following underneath the Public Class and Inherits lines, which allows us to manipulate this control in code:
- Whenever you want to display an in-your-face message, simply call this Say function in your code—as the following snippet demonstrates:
<script> <asp:Literal id="ltlAlert" runat="server" EnableViewState="False"> </asp:Literal> </script>
Protected WithEvents ltlAlert _ As System.Web.UI.WebControls.Literal
Say("Sorry, your password is invalid! " & _ Microsoft.VisualBasic.vbNewLine & _ "Please try again, or click the Signup button to _ register now.")
Caption: In-your-face Web error messages in just one line of code!
Displaying Web Warning Messages: Technique 2
There are times when you want to draw attention to an important message, without being overly loud. Sometimes, all you want to say is... "Thank you! Your information has been stored" or "Finished: all your outstanding reviews have been completed."
In these situations, a message box is a little overkill. Slightly more placid is the technique of displaying a whole Web page with just your core message at its center. I also prefer to add automatic redirects on such pages, so that after a few seconds, the user gets taken back to the previous page, or through to the next.
There are two ways to achieve this goal. First, create a separate page in your application that accepts a message in its query string, and then send your user across to that page.
Alternatively, you can do it wholly in code—which is just what we're doing here. I've created a small method holding a core HTML Web page, which you could perhaps load from a file. Inside that page, we have numerous variables (such as a message description) that get replaced by the method. Then, we push the modified HTML down the wire as a response to our client.
The HTML also contains a HTTP Refresh command, which by default takes the user back to the previous page. So, in brief: When you call the function, it displays a message for a number of seconds, and then returns to the issuing page.
Here's the function you'll need:
Don't forget: This is the raw version. You may wish to modify it to take your user off to another page. Perhaps you want to make it all template driven. But this snippet is at least a good step in the right direction.
Caption: Another way to display messages, albeit somewhat "quieter" than the last
Unveiled: How to Create a Default 'Enter' Button!
This is one of those little code snippets you can pull your hair out trying to find. And no help file nor book I've come across actually gives reference to it. So, surely it can't be that important?
Imagine you've created an ASP.NET Web page with a search button. The user taps a phrase into a text box and presses Enter. On most regular Web pages (think: Google), the form would be submitted and the results returned. In other words, the search button is automatically "clicked" for you.
However on an ASP.NET Web page, pressing Enter resubmits the form to the server, but actually does nothing... which is pretty useless, really.
So, how do you set a default button to be clicked when the user presses Enter? Simply add the following line to your page's Load event, replacing "btnSearch" with the name of your button. It uses a hidden Page method called RegisterHiddenField and works splendidly:
Wonders of the Little-Known SmartNavigation Property
Smart Navigation is a little-known Internet Explorer feature that enables the individual controls on your Web forms to maintain focus between post backs, plus allows you to suppress that "flicker" that occurs as you load the new page.
To turn on this little-known feature, simply set the SmartNavigation property of your ASPX page to True. Note that Smart Navigation only works on Internet Explorer 5 and above; however, the .NET Framework will automatically detect this and only serve up the "smart" code if the target browser supports it.
The Secret Behind User Controls
User controls are an often misunderstood piece of armory in your ASP.NET toolkit. They're not difficult. They're not exclusively reserved for large Web sites. But they could save you hours in development time.
So, what exactly are they? Well, if you're used ASP before, a Web user control is essentially an include file with frills. Everyone else: They're a method of creating a piece of a page once, then including it on numerous other Web pages.
For example, you may have a green menu with pretty icons, each linking to a different part of your site. You really don't want to go designing that manually for every single page. Rather, create the menu once as a user control, and then go slot it onto your other pages where necessary. You could do the same with a "Subscribe to our newsletter" box. Or the header logo on your site. Or the copyright notice.
Here's how you can get started with user controls in four easy steps:
- In your Web application project, select Project, Add Web User Control from the menu. Choose a name and click Open.
- Start designing your user control. Don't forget: This shouldn't be a complete Web page—rather, a small subset, such as a login box or copyright notice. Add code just as you would a regular ASP.NET Web form.
- When finished, close and save your user control.
- On the page you want to use or test your user control, drag-and-drop the .ASCX file from the Solution Explorer onto your page. You may drop it directly onto a raw page, or position it within a table cell.
That's it! Admittedly, the gray glyph may look a little drab now, but as soon as you run your application, it'll be replaced with whatever functionality you built into your user control. And you can use this same user control again and again, on as many pages as you wish. When you need to make changes, however, you only have one file to edit.
What a perfect way to save time and duplication of efforts!
Don't forget the real secret here: You can't overuse user controls. They're useful everywhere. If you think something is going to occur more than two or three times on your site, turn it into a user control.
Coming Up in Part Two of ASP.NET Secrets:
- Three Steps to Changing your Page Title in Code!
- How to Send Mail in ASP.NET
- The Secret to Uploading Files with Ease
- How to Dynamically Create Images
Want to contribute to this series? Then send your favorites Visual Studio .NET tips and tricks and I'll publish the best—email@example.com—with full credit given, of course.
See you next time!