C# • Build a Custom Login Page

Listing 1. Creating a custom login page doesn’t require a lot of code. Note the use of validation controls. Such controls let the user enter only valid values for a user name and a password. This code lets you see all the controls contained on the login page.

<form id="form1" runat="server">
   <div style="text-align: center">
   Please Log into the System<br />
   <asp:Panel ID="MainPanel" runat="server" Height="90px" 
      Width="380px"
      BorderColor="Silver" BorderStyle="Solid" 
         BorderWidth="1px">
      <br />
      <table width="100%" border="0" cellpadding="0" 
         cellspacing="0">
      <tr>
         <td width="30%" style="height: 43px">
            User Name:</td>
         <td width="70%" style="height: 43px">
            <asp:TextBox ID="UsernameText"
            runat="server" Width="80%" />
         <asp:RequiredFieldValidator
            ID="UsernameRequiredValidator" 
               runat="server"
            ErrorMessage="*" 
               ControlToValidate="UsernameText" />
         <br />
         <asp:RegularExpressionValidator
            ID="UsernameValidator" runat="server"
            ControlToValidate="UsernameText"
            ErrorMessage="Invalid username"
            ValidationExpression="[\w| ]*" />
         </td>
      </tr>
      <tr>
         <td width="30%" style="height: 26px">
            Password:</td>
         <td width="70%" style="height: 26px">
            <asp:TextBox ID="PasswordText" 
               runat="server"
            Width="80%" TextMode="Password" />
         <asp:RequiredFieldValidator 
            ID="PwdRequiredValidator"
            runat="server" ErrorMessage="*"
            ControlToValidate="PasswordText" />
         <br />
         <asp:RegularExpressionValidator ID="PwdValidator"
            runat="server" 
               ControlToValidate="PasswordText"
            ErrorMessage="Invalid password"
            ValidationExpression=
               '[\w| !"§$%&/()=\-?\*]*' />
         </td>
      </tr>
      </table>
      <br />
      <asp:Button ID="LoginAction" runat="server"
         OnClick="LoginAction_Click" Text="Login" /><br />
      <asp:Label ID="LegendStatus" runat="server"
         EnableViewState="false" Text="" />
   </asp:Panel>
   </div>
</form>