Saturday, May 1, 2010

ASP.NET - Server Controls(2)

ASP.NET - Server Controls(1) ရဲ႕အဆက္အေနနဲ႕ မေရးတာၾကာေပမဲ႕ ေစာင့္ဖတ္ေနပါတယ္ဆုိလို႕
Validation Server Controls အေၾကာင္းေလး ၾကိဳးစားျပီးတင္ေပးလိုက္ပါတယ္။
ေစာင့္ဖတ္တဲ႕ ေနာင္ေတာ္ကေတာ့ sample project including User Registration page with some ံုvalidation and Log In page with authentication to database. လို႕ ေျပာထားတာမုိ႕ manual validation နဲ႕ specialized error message ေတြကိုလဲ စစ္ထုတ္ထားျပီး တျခား controls ေတြနဲ႕ တြဲေရးထားတဲ႕ user registration form ပံုစံနမူနာေလးပါ။ ဒီပံုစံေလးထဲမွာ validation types ေတြ ေတာ္ေတာ္မ်ားမ်ား ပါပါတယ္။
user name နဲ႕ password ကို mandatory အေနနဲ႕ ျဖည့္ခုိင္းထားျပီး မျဖည့္ခဲ႕ရင္ error message ျပေစမဲ႕ required field validator ႏွစ္ခု၊
ျဖည့္ထားတဲ့ password ကို confirm password ျပန္ရိုက္ခုိင္းတဲ႕အခါ match ျဖစ္မျဖစ္စစ္ထားတဲ႕ compare validator တစ္ခု၊
email address မွာ @ symbol ေလးပါမပါ စစ္ဖုိ႕ regular expression validator
အသက္ ကို စစ္ဖုိ႕ range validator နဲ႕
ကိုယ္စစ္လိုရာကို သတ္မွတ္ျပီး စစ္ခုိင္းလို႕ ရတဲ႕ custom validator တစ္ခုတို႕ ပါပဲ။

UserReg.aspx(ဖုိင္နာမည္ ေပးရန္)

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="UserReg.aspx.cs" Inherits="UserReg" %>

<head runat="server">

<title>User Registration Page</title>

</head>

<body>

<form id="form1" runat="server">

<div>

<br /><br /><br /><br /><br /><br />

<asp:Label ID="Label1" runat="server" Style="z-index: 100; left: 19px; position: absolute;top: 14px" Text="User Name:"></asp:Label>

<asp:Label ID="Label2" runat="server" Style="z-index: 101; left: 22px; position: absolute;top: 48px" Text="Password"></asp:Label>

<asp:Label ID="Label3" runat="server" Style="z-index: 102; left: 21px; position: absolute;top: 84px" Text="Password(retype)"></asp:Label>

<asp:Label ID="Label4" runat="server" Style="z-index: 103; left: 19px; position: absolute;top: 121px" Text="E-mail:"></asp:Label>

<asp:Label ID="Label5" runat="server" Style="z-index: 104; left: 21px; position: absolute;top: 159px" Text="Age"></asp:Label>

<asp:Label ID="Label6" runat="server" Style="z-index: 105; left: 22px; position: absolute;top: 199px" Text="Referrer Code:"></asp:Label>

<asp:Button ID="Button1" runat="server" Style="z-index: 106; left: 120px; position: absolute;top: 261px" Text="Submit" OnClick="cmdSubmit_Click" />

<asp:Button ID="Button2" runat="server" Style="z-index: 107; left: 226px; position: absolute;top: 259px" Text="Cancel"OnClick="cmdCancel_Click" />

<asp:TextBox ID="txtUserName" runat="server" Style="z-index: 108; left: 154px; position: absolute;top: 14px"></asp:TextBox>

<asp:TextBox ID="txtPassword" runat="server" Style="z-index: 109; left: 152px; position: absolute;top: 47px"></asp:TextBox>

<asp:TextBox ID="txtRetype" runat="server" Style="z-index: 110; left: 151px; position: absolute;top: 79px"></asp:TextBox>

<asp:TextBox ID="txtEmail" runat="server" Style="z-index: 111; left: 151px; position: absolute;top: 119px"></asp:TextBox>

<asp:TextBox ID="txtAge" runat="server" Style="z-index: 112; left: 150px; position: absolute;top: 153px"></asp:TextBox>

<asp:TextBox ID="txtCode" runat="server" Style="z-index: 113; left: 149px; position: absolute;top: 193px"></asp:TextBox>

<asp:CustomValidator ID="vldCode" runat="server" ErrorMessage="Try a string that starts with 014" ControlToValidate="txtCode" OnServerValidate="vldCode_ServerValidate" style="z-index: 114; left: 317px; position: absolute; top: 194px" />

<asp:RangeValidator ID="vldAge" runat="server" ErrorMessage="age must be between 0 and 120"

Type="Integer" MinimumValue="0" MaximumValue="120" ControlToValidate="txtAge" style="z-index: 115; left: 319px; position: absolute; top: 158px" />

<asp:RegularExpressionValidator ID="vldEmail" runat="server" ErrorMessage="You email does not contain @ symbol" ValidationExpression=".+@.+" ControlToValidate="txtEmail" style="z-index: 116; left: 318px; position: absolute; top: 121px" />

<asp:CompareValidator ID="vldRetype" runat="server" ErrorMessage="Your password does not match" ControlToCompare="txtPassword" ControlToValidate="txtRetype" style="z-index: 117; left: 321px; position: absolute; top: 82px" />

<asp:RequiredFieldValidator ID="vldPassword" runat="server" ErrorMessage="You must enter a password:" ControlToValidate="txtPassword" style="z-index: 118; left: 323px; position: absolute; top: 46px" />

<asp:RequiredFieldValidator ID="vldUserName" runat="server" ErrorMessage="You must enter a user name:" ControlToValidate="txtUserName" style="z-index: 119; left: 320px; position: absolute; top: 14px" />

<asp:Label ID="lblMessage" runat="server" Style="z-index: 121; left: 1px; position: absolute;

top: 309px" Text="Label"></asp:Label>

</div>

</form>

</body>

</html>



UserReg.aspx.cs(ဖုိင္နာမည္ ေပးရန္)

using System;

using System.Data;

using System.Configuration;

using System.Collections;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

public partial class UserReg : System.Web.UI.Page

{

protected void cmdSubmit_Click(object sender, EventArgs e)

{

if (!this.IsValid) return;

lblMessage.Text = "This is a valid form";

}

protected void cmdCancel_Click(object sender, EventArgs e)

{

lblMessage.Text = "No attempt was made";

}

protected void vldCode_ServerValidate(object source, ServerValidateEventArgs e)

{

try

{

int val = Int32.Parse(e.Value.Substring(0, 3));

if (val % 7 == 0)

{

e.IsValid = true;

}

else

{

e.IsValid = false;

}

}

catch

{

e.IsValid = false;

}

}

}



Browser တြင္ ၾကည္႕ရန္ page တြင္ right click ႏွိပ္၍ View in Browser ကိုေရြးျပီး run ၾကည္႕ပါ။
run ၾကည့္လို႕ ဒါေလးကို သေဘာေပါက္သြားရင္ေတာ့ အခု ေအာက္က ပံုေလးအတုိင္း coding ေလး ေရးၾကည့္ေစခ်င္ပါတယ္။ childplay ပဲျဖစ္မွာပါ။


label ေလးကေတာ့ OK button ေလးကို ႏွိပ္ျပီး submit လုပ္ျပီးတဲ႕အခါမွာ Your donation amount is thankfully received ဆိုတဲ့ message ေလးျပေပးေစခ်င္တာပါ။

Try it! Cheers

No comments: