Using the ValidationSummary Control

Using the `ValidationSummary` Control

The ValidationSummary control enables you to display a list of all the validation errors in a page in one location. This control is particularly useful when working with large forms. If a user enters the wrong value for a form field located toward the end of the page, then the user might never see the error message. If you use the ValidationSummary control, however, you can always display a list of errors at the top of the form.

You might have noticed that each of the validation controls includes an ErrorMessage property. We have not been using the ErrorMessage property to represent the validation error message. Instead, we have used the Text property.

The distinction between the ErrorMessage and Text property is that any message that you assign to the ErrorMessage property appears in the ValidationSummary control, and any message that you assign to the Text property appears in the body of the page. Normally, you want to keep the error message for the Text property short (for example, "Required!"). The message assigned to the ErrorMessage property, on the other hand, should identify the form field that has the error (for example, "First name is required!").

Note

If you don't assign a value to the Text property, then the value of the ErrorMessage property is displayed in both the ValidationSummary control and the body of the page.

The page in Listing 3.18 illustrates how you can use the ValidationSummary control to display a summary of error messages (see Figure 3.14).

Figure 3.14. Displaying a validation summary.

Listing 3.18. `ShowValidationSummary.aspx`

<%@ Page Language="VB" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head  runat="server">     <title>Show ValidationSummary</title> </head> <body>     <form  runat="server">     <div>     <asp:ValidationSummary                  Runat="server" />     <asp:Label                  Text="First Name:"         AssociatedControl         Runat="server" />     <br />     <asp:TextBox                  Runat="server" />     <asp:RequiredFieldValidator                  Text="(Required)"         ErrorMessage="First Name is required"         ControlToValidate="txtFirstName"         Runat="server" />     <br /><br />     <asp:Label                  Text="Last Name:"         AssociatedControl         Runat="server" />     <br />     <asp:TextBox                  Runat="server" />     <asp:RequiredFieldValidator                  Text="(Required)"         ErrorMessage="Last Name is required"         ControlToValidate="txtLastName"         Runat="server" />     <br /><br />     <asp:Button                  Text="Submit"         Runat="server" />     </div>     </form> </body> </html>

If you submit the form in Listing 3.18 without entering a value for the first and last name, then validation error messages appear in both the body of the page and in the ValidationSummary control.

The ValidationSummary control supports the following properties:

DisplayMode Enables you to specify how the error messages are formatted. Possible values are BulletList, List, and SingleParagraph.
HeaderText Enables you to display header text above the validation summary.
ShowMessageBox Enables you to display a popup alert box.
ShowSummary Enables you to hide the validation summary in the page.

If you set the ShowMessageBox property to the value true and the ShowSummary property to the value False, then you can display the validation summary only within a popup alert box. For example, the page in Listing 3.19 displays a validation summary in an alert box (see Figure 3.15).

Figure 3.15. Displaying a validation summary in an alert box.

Listing 3.19. `ShowSummaryPopup.aspx`

<%@ Page Language="VB" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head  runat="server">     <title>Show Summary Popup</title> </head> <body>     <form  runat="server">     <div>     <asp:ValidationSummary                  ShowMessageBox="true"         ShowSummary="false"         Runat="server" />     <asp:Label                  Text="First Name:"         AssociatedControl         Runat="server" />     <br />     <asp:TextBox                  Runat="server" />     <asp:RequiredFieldValidator                  ErrorMessage="First Name is required"         ControlToValidate="txtFirstName"         Display="None"         Runat="server" />     <br /><br />     <asp:Label                  Text="Last Name:"         AssociatedControl         Runat="server" />     <br />     <asp:TextBox                  Runat="server" />     <asp:RequiredFieldValidator                  ErrorMessage="Last Name is required"         ControlToValidate="txtLastName"         Display="None"         Runat="server" />     <br /><br />     <asp:Button                  Text="Submit"         Runat="server" />     </div>     </form> </body> </html>

Notice that both of the RequiredFieldValidator controls have their Display properties set to the value None. The validation error messages appear only in the alert box.