Developing an ASP.NET AJAX Server Centric Based Mini Blog System - Part 1
page 7 of 9
by Xianzhong Zhu
Feedback
Average Rating: This article has not yet been rated.
Views (Total / Last 10 Days): 44353/ 126

The Login System

In this case, we have not utilized the normal and strict ASP.NET authenticating system, but adopted a simple login means, which is accomplished through page Login.aspx. Figure 7 gives the related design-time snapshot.

Figure 7: The design-time snapshot of page Login.aspx

 

First, we should notice that now Visual Studio 2008 provides the ability to add "AJAX Master Page" template directly, which results in an ASP.NET AJAX ScriptManager control being added into the master page. Therefore, we now (in the content page) are unable to see the control. Next, we can see this login content page contains only a few simple ASP.NET controls as well as two ASP.NET AJAX Control Toolkit extender controls - TextboxWatermarkExtender (which is used to achieve the watermark effect with the TextBox control adminname) and PasswordStrength (which is used to intuitively remind the users of the password strength of what they enter into the password textbox control). And also, we used the simplest ASP.NET validator, RequiredFieldValidator, to ensure the user does enter something.

Next, let us look more closely at the crucial HTML mark code, as shown in Listing 2.

Listing 2: The key HTML mark code in page Login.aspx

<tr>
      <td width="50%" >
            <div align="center">User Name:</div>
      </td>
      <td style="text-align: left">&nbsp;
            <asp:TextBox id="adminname" runat="server" CssClass="cssUnwatermark" 
            Width="228px"></asp:TextBox>
            
            <asp:RequiredFieldValidator id="rfN" runat="server" 
                ControlToValidate="adminname" 
                Text="The name field cannot be empty!" 
                InitialValue="Please enter username here..." 
            Display="Dynamic"  >
        </asp:RequiredFieldValidator>
        <asp:RequiredFieldValidator ID="rfv2" ControlToValidate="adminname"  
            Text="The name field cannot be empty!"     
            Display="Dynamic" 
        runat="server" />
           
        <cc1:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender1" 
        runat="server"  
        TargetControlID="adminname" 
        WatermarkCssClass="cssWatermark"  
        WatermarkText="Please enter username here...">
        </cc1:TextBoxWatermarkExtender>   
    </td>
</tr>
<tr>
      <td ><div align="center">Password:</div>
      </td>
      <td style="text-align: left">&nbsp;
            <asp:TextBox id="adminpsw" runat="server" TextMode="Password" 
            style="text-align: left" Width="227px"></asp:TextBox>
            <asp:RequiredFieldValidator id="RequiredFieldValidator2" 
                runat="server" ErrorMessage="The password field cannot be empty!" 
                ControlToValidate="adminpsw"></asp:RequiredFieldValidator>
 
        <cc1:PasswordStrength ID="PasswordStrength1" runat="server"
            TargetControlID="adminpsw" 
            StrengthIndicatorType="Text"
            HelpHandlePosition="AboveRight"
            DisplayPosition="BelowRight"
            MinimumNumericCharacters="1"
            MinimumSymbolCharacters="1"
            PrefixText="Strength:"
            PreferredPasswordLength="6"
            TextCssClass="texttype"
            TextStrengthDescriptions="Weak;Not enouth;Medium;Strong;"
            HelpHandleCssClass="help" 
            HelpStatusLabelID="Label1">
        </cc1:PasswordStrength>
        <br />
        <asp:Label ID="Label1" runat="server" Width="369px"></asp:Label>
    </td>
</tr>
<tr>
      <td ><div align="center">Please confirm your password:</div>
      </td>
      <td style="text-align: left">&nbsp;
            <asp:TextBox id="PasswordStr" runat="server" TextMode="Password" 
            style="text-align: left" Width="227px"></asp:TextBox>
            <asp:CompareValidator ID="CompareValidator1" runat="server" 
                  ControlToCompare="adminpsw"
                  ControlToValidate="PasswordStr" 
                  ErrorMessage="The password is different from the previous one!">
            </asp:CompareValidator>
      </td>
</tr>
<tr >
      <td height="25" colspan="2">
            <div align="center">
                  <asp:Button id="Button1" runat="server" Text="Login" 
                      onclick="Button1_Click" 
                      CssClass="ButtonCss" Width="104px">
                  </asp:Button>&nbsp;&nbsp;[<a href="Index.aspx">Back to Home</a>]
            </div>
      </td>
</tr>

It is worth noting that for brevity we select to omit explaining the two simple ASP.NET AJAX Control Toolkit extenders. Therefore, for more details concerning their usage you can refer to the downloaded source code at the end as well as the tutorial site for ASP.NET AJAX Control Toolkit controls.

Author’s Notes: In constructing an ASP.NET AJAX Server-Centric based website, you are recommended to use ASP.NET server controls as much as possible rather than the client-side HTML controls in order to set up your system more rapidly. However, what is better to choose will in the end fall back upon your own familiarity with the tools at hand.

When the button "Login" is clicked, its related click event handler is triggered. Listing 3 gives the related code snippet.

Listing 3: The key code for file Login.aspx.cs

public partial class Login : System.Web.UI.Page
{
    SqlConnection ST_myConn;
    protected void Page_Load(object sender, EventArgs e)
    {
        string ST_dns = 
ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;
        ST_myConn = new SqlConnection(ST_dns);
    }
    protected void Button1_Click(object sender, EventArgs e)
    {
            SqlCommand ST_myCmd = new SqlCommand(
                  "select * from ST_admin where ST_admin_user='" + 
                  adminname.Text.Trim() + "' and ST_admin_psw='" + 
                  adminpsw.Text.Trim() + "'", ST_myConn);
            ST_myConn.Open();
            SqlDataReader ST_read = ST_myCmd.ExecuteReader();
            if(ST_read.Read())
            {
                  //store the value of field ST_admin_user into Session
                  Session["UserName"]=ST_read[0].ToString();
                  //redirect the user to the page Admin_Admin.aspx
            Response.Redirect("Admin_Admin.aspx");
            }
            else
            {
                  Response.Write(
"<script>alert('Sorry,the username and password are incorrect!')</script>");
            }
      }
}

In function Page_Load, we found the database connection string from file web.config and set up the connection using the ADO.NET object—SqlConnection. Next, when button "Login" is clicked, its click event handler Button1_Click is invoked. As you have seen, here we directly worked with the SELECT SQL clause which represents the typical two-tier architecture operation.

Note that at the very beginning of designing table ST_admin there is only a record in it—the value of field ST_admin_user being "admin" and the value of field ST_admin_psw being "1." So, according to your own situation, you can add by hand to the table any other records that describe the valid users (often blog hosts). In this case, when the current user is verified to be the valid user, he will be navigated to the backend administrator management related page, Admin_Admin.aspx.

Again, for simplicity, we grant the sale privileges to the administrator and the blog host, while in real scenarios this may not necessarily be the case.

So far the discussion has been about page login.aspx.  Next we switch our topic to the homepage of the system, index.aspx.


View Entire Article

User Comments

Title: Khabar   
Name: Sarfraz
Date: 2010-12-20 8:55:44 AM
Comment:
Hello Nice






Community Advice: ASP | SQL | XML | Regular Expressions | Windows


©Copyright 1998-2019 ASPAlliance.com  |  Page Processed at 2019-11-21 5:28:50 AM  AspAlliance Recent Articles RSS Feed
About ASPAlliance | Newsgroups | Advertise | Authors | Email Lists | Feedback | Link To Us | Privacy | Search