Completing an In-Text Advertising System under an ASP.NET 3.5 Environment
(Page 1 of 5 )
In the second installment of this series, you saw the core client-side script programming and related server-side code. Now, in this third (and last) part, we will look at the programming associated with the presentation tier, i.e. the website owner- and administrator-related code as well as all of the other web pages.
Website owners and system administrators are the two most necessary users. In this example, website owners have the ability to obtain the ad code on the fly to place it inside their own websites; also, if logged in, they can view their own ad data. System administrators, however, own the rights to manage the ad keywords and related detailed content. This part will introduce to you the process of logging in, the member center of the website owners, how to manage the ad keywords, and so forth.
Designing the Login.aspx Page
In this system, the Login.aspx page bears the task of handling the login both of the website owners and the system administrator. Figure 1 indicates the related running-time snapshot.
Figure 1—the login page for all the website owners and the administrators
_html_3f997220.png)
As you’ve seen above, the layout of the login page is rather typical and simple, where a verification code is nearly a MUST HAVE in today’s website construction.
Well, let’s look into the HTML code of the login.aspx page, as shown below.
<body>
<form id="Form1" style="text-align: center; width: 100%; margin-top: 100px" runat="server">
<span style="font-size: 14pt; color: #cc9966"><strong>The Backend Login<br />
<br />
</strong></span>
<table cellpadding="0" cellspacing="0" border="0" width="250" height="150">
<tr>
<td>
Account:</td>
<td>
<asp:TextBox ID="name" runat="server" Width="150px" BorderWidth="1px"></asp:TextBox>
<br />
</td>
</tr>
<tr>
<td>
Password:</td>
<td>
<asp:TextBox ID="pws" runat="server" Width="150px" BorderWidth="1px" TextMode="Password"></asp:TextBox>
</td>
</tr>
<tr>
<td colspan="2" style="text-align: center">
<iframe id="vali" name="vali" src="gif.aspx" width="66" height="20" marginwidth="0"
marginheight="0" hspace="0" vspace="0" frameborder="0" scrolling="No" style="top: 0px;
width: 89px; height: 35px;"></iframe>
</td>
</tr>
<tr>
<td>
Verifying code: </td>
<td style="text-align: left">
<input id="userVer" runat="server" maxlength="6" name="text2" size="6" type="text"
style="height: 18px" />
<span style="color: #0000ff; cursor: pointer; text-decoration: underline"
onclick="javascript:document.getElementById('vali').contentWindow.location.reload();">
Refresh the verifying code</span>
</td>
</tr>
<tr>
<td style="text-align: center;" colspan="2">
<br />
<asp:Button ID="log" runat="server" Text="Login" Width="150px" BorderStyle="Solid" BorderWidth="1px"
BackColor="#E0E0E0" BorderColor="Gray" OnClick="log_Click"></asp:Button>
</td>
</tr>
</table>
</form>
</body>
Obviously, I’ve applied the typical table layout. Looking more closely, you can see that there are only two points worth noticing. One is the following line:
<iframe id="vali" name="vali" src="gif.aspx" ……></iframe>
The <iframe> element was frequently used in early web applications that needed to partially update a page. For details on this related programming, continue to read the next section. The other point worth noticing is this:
<span style="color: #0000ff; cursor: pointer; text-decoration: underline"
onclick="javascript:document.getElementById('vali').contentWindow.location.reload();">
Refresh the verifying code</span>
With this section, when you click the phrase "Refresh the verifying code," the related click event handler will be triggered to execute the related short script sentence, which will partially update the corresponding <iframe> area on the target page. For information on the use of this JavaScript, you can go here .
Next, let's take a look at the crucial code behind the Login.aspx page:
protected void log_Click(object sender, System.EventArgs e)
{
//judge the verifying code
if (userVer.Value.Trim().ToLower() != Session["sdf"].ToString().ToLower())
{
ClientScript.RegisterStartupScript(this.GetType(), "ab", "alert('Invalid verifying code!');", true);
return;
}
if (name.Text == "qucha" && pws.Text == "000000")//judge whether is an adminstrator;if so, then redirected to page admin1.aspx
{
Session["admin"] = "true";
Response.Redirect("admin1.aspx", true);
}
//verify the password and related account info
Sql s = new Sql();
SqlParameter para = new SqlParameter();//the returned parameters for the stored procedure
para.ParameterName = "@returnValue";
para.Direction = ParameterDirection.ReturnValue;
s.command.Parameters.Add(para);
s.command.Parameters.AddWithValue("@username",name.Text);
s.command.Parameters.AddWithValue("@userpass", Tools.Encrypt(pws.Text,"12345678"));
s.exec("userlogin");//execute the login related SP
if (para.Value.ToString()!="3")//login succeed
{
System.Web.Security.FormsAuthentication.SetAuthCookie(name.Text, true);
Response.Redirect("siteUser.aspx");
}
else//login fail
{
ClientScript.RegisterStartupScript(this.GetType(), "a", "alert('Invalid password');", true);
}
}
Because the website owners and the system administrator share the same login form, we have to make judgments respectively. When the user clicks the "Login" button, we first resolve the verifying code and judge whether it is correct; and if so, continue to judge whether the administrator is logging in (the correct account name and password are "qucha" and "000000" respectively). If the current user is the administrator, then he is navigated to the "admin1.aspx" page; otherwise, the website owner-related login code is executed.
If the current user has not been registered, then he is immediately registered and redirected to the member center (the siteUser.aspx page). If the current user has been registered, then his password is verified, and if all is okay, he will also be redirected to the member center (the siteUser.aspx page).
Note there is a shortcoming with the procedure above. We’ve used the hard-coded username and password, but in practical cases this is absolutely prohibited.
Next: The Verification Code >>
More ASP.NET Articles
More By Xianzhong Zhu