CHƯƠNG III:  HTML SERVERCONTROL VÀ WEB SERVER CONTROL 
Lý thuyết 3 tiết 
Thực hành 6tiết 
HTML Server Control 
Các HTML control thông thường như , , sẽ không được xử lý bởi server mà được gửi trực tiếp cho browser để hiển thị 
Các HTML control có thể được xử lý ngay tại phía server bằng cách chuyển chúng thành các HTML server control . 
HTML Server Control 
Chuyển một HTML control thành một HTML server control bằng cách thêm thuộc tính runat=”server” vào trong các tag HTML 
Cú pháp: 
V í dụ: 
HTML Server Control 
Tất cả HTML Server Control phải được đặt trong tag với thuộc tính runat = “server” 
HTML Server Control tồn tại bên trong không gian tên System.Web.UI.HtmlControls 
Hệ thống thứ bậc của HTML Server Controls 
HTML Server Control 
Các sự kiện ( event ) của HTML server Control : 
onServerClick 
onServerChange 
onStartSelect, 
Cú pháp: 
Lưu ý : Function không có tham số . 
HTML Server Control 
Ví dụ: 
HTML Server Control 
Cách lấy dữ liệu từ các HTML server 
	Cú pháp: 
Đối với tag DIV, SPAN dùng thuộc tính .innerHTML 
controlfield_id.Value 
HTML Server Control 
V í dụ: 
 public void btnSend_ServerClick ( object sender , System.EventArgs e ) 
{ 
 String strName; 
 strName= txtName .Value; 
 Response.Write(“Hello :”+strName) 
 } 
Ví dụ 
void Button_ServerClick (object sender, EventArgs e) 
{ 
	 MySpan .InnerHtml = “Chao ban : " + myText.Value + "."; 
} 
<input id="Submit1" type="submit" Value="Click Here!" 
OnServerClick=" Button_ServerClick " runat="server"> 
Web Server Control 
Web server control là những tag đặc biệt của ASP.NET. Các control này được xử lý trên server và đòi hỏi phải có thuộc tính runat= “server” 
Web server control tồn tại bên trong không gian tên System.Web.UI.WebControls 
Cú pháp: 
Hệ thống thứ bậc của Web Server Control 
Web Server Control 
Nhóm control cơ bản 
Cú pháp chung: 
Các control cơ bản gồm: 
Web Server Control 
Label 
Textbox 
Button 
CheckBox and Radio 
Image, Hyperlink, Panel 
List Controls group 
Table 
AddRotator 
FileUpload 
Validation 
Web Server Control 
Label server control: dùng hiển thị văn bản trên trình duyệt.Thuộc tính : 
	Text: sử dụng để nhận hoặc gán text 
	ví dụ: 
	 String strName=lblMsg.Text; 
	Or lblMsg.Text=“Value”; 
Web Server Control 
TextBox : dùng để nhập liệu từ người sử dụng và hiển thị văn bản chỉ đọc 
Thuộc tính : 
AutoPostBack: có 2 giá trị True và False khi một hành động trên trang web bẩy một sự kiện. 
	Ví dụ: 
Web Server Control 
TextMode: Loại textbox: singleLine, MultiLine, Password 
Text: trả về giá trị hoặc gán giá trị 
ReadOnly : Dữ liệu không thay đổi 
Ví dụ: 
String strName=txtName.Text; 
Hoặc txtName.Text=“Value”; 
Web Server Control 
Sự kiện: 
Text_Changed() 
Focus(): cho phép đưa trỏ về phần tử được chỉ định trên form. 
	ví dụ: 
	txtName.Focus(); 
Web Server Control 
Button : thường sử dụng để submit form 
Phân loại: 
Button 
LinkButton 
ImageButton 
Sự kiện 
Onclick() 
OnserverClick() 
Web Server Control 
Checkbox 
Các thuộc tính: 
AutoPostBack 
Checked 
Text 
Sự kiện: 
CheckedChange () 
Web Server Control 
RadioButton 
Thuộc tính: 
GroupName: tên của nhóm 
Text: nội dung văn bản của radioButton 
Checked : radioButton được chọn 
Sự kiện 
onClick() 
onCheckedChanged() 
Web Server Control 
Image : 
Thuộc tính: 
ImageUrl : Địa chỉ của hình cần hiển thị 
AlternateText: Dòng văn bản hiển thị khi hình không có sẳn 
ImageAlign: canh vị trí tương đối của hình so với văn bản trên trang 
Web Server Control 
Hyperlink 
Thuộc tính: 
ImageUrl :đường dẫn đến hình cần hiển thị (nếu dùng thuộc tính này thì hyperlink có tác dụng giống như Imagebutton) 
NavigateUrl : Địa chỉ URL cần link đến 
Text : chuỗi văn bản chỉ mục liên kết hiển thị trên trình duyệt 
Target : chỉ cửa sổ hiển thị trang đích 
Web Server Control 
Panel 
Ý nghĩa : được dùng như ContainerControl đối với các control khác, nó thi hành nhiều chức năng:Kiểm soát các control chứa trong Panel Control 
Được dẫn xuất từ lớp Webcontrol 
Web Server Control 
Cú pháp 
Thuộc tính : 
Visible : thuộc tính nhìn thấy đựơc của control bên trong Panel control 
BackImageUrl: URL của hình ảnh hiển thị phía sau table. 
Backcolor : màu nền của control 
</asp:Panel 
Web Server Control 
Nhóm ListControl: 
DropDownList 
ListBox 
CheckBoxList 
RadioButtonList 
ListItem : Hoạt động giống nhau với 2 thuộc tính Value va Text 
Item có thể được thêm vào theo cách tĩnh (Design) hoặc Lập trình (Coding), Add 
Các thuộc tính: 
 SelectedIndex : trả về chỉ số của phần tử được chọn. 
SelectedItem : trả về phần tử được chọn. 
SelectedValue : trả về giá trị được chọn. 
Sự kiện: SelectedIndexChaged 
Web Server Control 
AutoPostBack : true hoặc false 
Items.Count : trả về số phần tử trong listControls 
Items.Add(ListItem) : thêm phần tử vào listControls 
Items.Remove(ListItem) : xoá phần tử khỏi ListControl 
Items.Clear() : Xoá tất cả các phần tử. 
Items[ i ].Selected : trả về true hoặc false. True nếu phần tử đựơc chọn 
Với i=0, n-1 (n=Items.Count). 
Web Server Control 
Web Server Control 
DataSource : thiết lập giá trị từ DataSource như DataTable,DataSet,Array,Collection,DataView 
DataTextField : thiết lập phần tử text từ DataSource 
DataValueField : thiết lập giá trị phần tử từ DataSource 
DataBind() : binding data vào ListControl 
(Là các thông tin Data lấy được từ CSDL tại 
Chương 7 ) 
Web Server Control 
Các đặc tính 
CheckboxList 
RadioButtonList 
DropDown List 
ListBox 
Chọn 1 Item duy nhất 
X 
X 
Chọn hơn 1 Item 
X 
X 
Hiển thị toàn bộ danh sách 
X 
Web Server Control 
Ví dụ: DropDownList 
 	 	Anh 
 	 Pháp 
 	 Hoa 
Web Server Control 
protected void btnThem_Click( object sender, EventArgs e) 
 { 
 drpLan.Items.Add(txtThem.Text); 
 } 
protected void Page_Load( object sender, EventArgs e) 
 { 
 if (drpLan.SelectedItem!= null ) 
 lblKq.Text= "The selected item is: " + drpLan.SelectedItem.Text; 
 else 
 lblKq.Text= "No item is selected" ; 
 } 
Web Server Control 
Ví dụ: CheckBoxList 
	 Cau hinh Phan cung 
	 Co so du lieu 
Web Server Control 
protected void Page_Load ( object sender, EventArgs e) 
 { 
 string [] maMH ={ "001" , "002" , "003" , "004" }; 
 string [] tenMH ={ "LT Windows" , "LT Internet" , "AVCN" , "Cau hinh Mang" }; 
 for ( int i = 0; i < maMH.Length; i++) 
 { 
 chkMonhoc.Items.Add( new ListItem (tenMH[i],maMH[i])); 
 } 
} 
Ví dụ: RadioButtonList 
 10 
 12 
 14 
 16 
Web Server Control 
protected void Page_Load( object sender, EventArgs e) 
 { 
 if (!IsPostBack) 
 { 
 int [] sizefont ={ 18, 20, 22, 24 }; 
 for ( int i = 0; i < sizefont.Length; i++) 
 radFont.Items.Add( new ListItem (sizefont[i].ToString())); 
 } 
 } 
Web Server Control 
protected void radFont_SelectedIndexChanged( object sender, EventArgs e) 
 { 
 int sizeselected = Convert .ToInt32(radFont.SelectedValue); 
 lblKq.Font.Size = sizeselected; 
 } 
Web Server Control 
Web Server Control 
Table: Hiển thị thông tin dưới dạng dòng và cột. 
Table control cho phép xây dựng các bảng động bằng mã lệnh sử dụng các thuộc tính tập hợp Table Rows và Table Cells 
Web Server Control 
ASP ControlHTML 
HTMLControl 
Table 
TableRow 
TableCell 
TableHeaderCell 
Cú pháp 
Web Server Control 
AdRotator Server Control :quảng cáo trên trang web 
Thuộc tính: 
ImageUrl: URL của hình ảnh cần được hiển thị 
NavigateUrl: URL của trang web phải chuyển đến control khi có sự kiện click. 
AlternateText : Dòng văn bản hiển thị khi hình không có sẳn 
 Keyword: loại quảng cáo 
Web Server Control 
FileUpload Server Control : dùng thực hiện upload file lên server 
Các thuộc tính: 
FileName : Tên file được upload lên 
FileBytes : Mảng bytes chứa nội dung file upload 
PostedFile : Hiển thị đầy đủ như 1 đối tượng HttpPostedFile . HttpPostedFile có các thuộc tính 
FileName: Ten File 
ContentType : Loại File (.doc, .mdb, ) 
ContentLength : Kích thước của File. 
SaveAs : Lưu file upload vào 1 thư mục bất kỳ 
Web Server Control 
Ví dụ: 
protected void btnShow_Click( object sender, EventArgs e) 
 { 
 lblFliename.Text = FileUpload1.PostedFile.FileName.ToString(); 
 lblType.Text = FileUpload1.PostedFile.ContentType.ToString(); 
 lblLength.Text = FileUpload1.PostedFile.ContentLength.ToString(); 
 //Luu file 
 string filename = FileUpload1.FileName.ToString(); 
 FileUpload1.PostedFile.SaveAs(Server.MapPath( "" ) + "\\BT_Chuong3_ListControl" + filename); 
 } 
Web Server Control 
Validation Server Control 
Validation Server Control 
RequiredFieldValidator Server Control : yêu cầu người dùng bắt buộc phải nhập liệu 
Cú pháp: 
<asp: RequiredFieldValidator ID="RequiredFieldValidator1" 	runat="server“ ControlToValidate ="input_Control“ 	 ErrorMessage =“Content_Message” 
Validation Server Control 
Thuộc tính 
ControlToValidate : nhận một ID của một control khác ở trên form để kiểm tra nhập liệu. 
Display : có ba giá trị : none, static , dynamic. thể hiện thông báo động hay tỉnh. 
EnableClientScript: nhận true thì hiểu các script ở phía client, false thì không. 
ErrorMessage: dòng thông báo khi dữ liệu không hợp lệ. 
Initialvalue : giá trị khởi tạo 
Validation Server Control 
Các sự kiện 
DataBinding() 
Disposed() 
Int() 
Load(): Lập trình sự kiện này là để đặt giá trị ban đầu cho control. 
PreRender() 
Unload() 
Validation Server Control 
Ví dụ: thiết kế form có dạng như sau, khi click nút submit, nếu chưa nhập tên thí xuất hiện thông báo lỗi 
Mã chương trình 
	Enter Your Name: 
<asp: RequiredFieldValidator id="validTxtName" runat="server" controlToValidate ="txtName“ 
	errorMessage="Name must be entered" display="static"> 
Validation Server Control 
RangeValidator Server Control: Kiểm tra giới hạn nhập liệu, giá trị nhập phải nằm trong khoảng giới hạn cho trước, giới hạn này có thể là các hằng được đưa vào lúc thiết kế hoặc so sánh với các control khác trên trang web 
Validation Server Control 
Cú pháp : 
<asp: RangeValidator id=" RangeValidator1 " runat="server“ display="static“ controlToValidate=" input_Control " 
errorMessage= " Content_Message " type = “ Integer" minimumValue=minValue maximumValue=maxValue> 
Validation Server Control 
Thuộc tính: 
minimumValue, maximumValue : khoảng giới hạn giá trị nhập liệu 
ControlToValidate : chứa ID của một control khác ở trên form để kiểm tra giới hạn nhập liệu. 
Display : có giá trị none, static, dynamic. Chọn kiểu thể hiện thông báo. 
Validation Server Control 
RegularExpressionValidator Server Control: kiểm tra dữ liêu nhập với khuôn biểu thức mẫu (RegularExpression) đã được định nghĩa trước. Visual Studio .NET cung cấp các khuôn biểu thức mẫu: 
Telephone numbers 
Postal codes 
E-mail addresses 
Validation Server Control 
<asp:RegularExpressionValidator  
	 ControlToValidate=“ Input_control "ValidationExpression =“ RegularExpression ">* 
Thuộc tính: 
	ValidationExpression : Khung của biểu thức mẫu để so sánh kiểm tra 
Cú pháp: 
Validation Server Control 
CompareValidator Server Control : So sánh dữ liệu nhập với một trị trong một control khác hoặc một hằng được cho trước khi thiêt kế hoặc một giá trị trong dữ liệu. Các phép toán so sánh >,>=,<,<= 
Cú pháp: 
<asp: CompareValidator id="comID" runat="server" 	display="static“ controlToValidate="txtR" 	errorMessage=" Content_Message " 
	type=" Double“ ValueToCompare=“Hang cn so sanh” operator="DataTypeCheck"> 
Validation Server Control 
Thuộc tính 
ControlToCompare: chứa ID của một control mà giá trị của control ID này sẽ so sánh với dữ liệu của một control khác 
ControlToValidate : chứa ID của một control mà dữ liệu của control này được so sánh vớI dữ liệu của control ở thuộc tính trên. 
Operator: Toán tử so sánh 
Type : Kiểu dữ liệu để so sánh gồm (String, Integer, Date, Double, Currency) 
ValueToCompare: chứa giá trị so sánh hằng 
Validation Server Control 
Các sự kiện 
DataBinding() 
Disposed() 
Int() 
Load(): Lập trình sự kiện này là để đặt giá trị ban đầu cho control. 
PreRender() 
Unload() 
Validation Server Control 
CustomValidator Server Control 
Kiểm tra tính hợp lệ dữ liệu của một control theo một yêu cầu, một ràng buộc nào đó, hay một kiểu dữ liệu được người sử dụng định nghĩa trước đó. 
CustomValidator Server Control có thể kiểm tra hợp lệ cả phía client và server 
Validation Server Control 
Thuộc tính 
ClientValidationFunction : thuộc tính này nó chứa một tên hàm, mà hàm này được lập trình ở client (bằng javascript). 
ControlToValidate : Nhận ID của một control trên form để kiểm tra dữ liệu. 
Validation Server Control 
Các sự kiện 
DataBinding() 
Disposed() 
Int() 
Load(): Lập trình sự kiện này là để đặt giá trị ban đầu cho control. 
PreRender() 
ServerValidate(): sự kiện này được lập trình trên server để kiểm tra tính hợp lệ của dữ liệu. 
Unload() 
Validation Server Control 
Ví dụ: thiết kế form như sau, yêu cầu kiểm tra số Pin 
// Mã giao diện 
User ID: 
PIN: 
 Invalid PIN number! 
//hàm ServerVerify kiểm tra trên server 
void ServerVerify(Object Sender, ServerValidateEventArgs Value) 
 { 
 	if (txtPIN.Text == "A999") 
 	Value.IsValid = true; 
 	else 
 	Value.IsValid = false; 
 } 
Validation Server Control 
ValidationSummary Server Control : tập hợp các thông báo lỗi từ tất cả các điều khiển trên một trang 
Cú pháp: 
Validation Server Control 
Thuộc tính 
DisplayMode : cung cấp 3 định dạng hiển thị Messagebox: List ,BulletList, SingleParagraph HeaderText : Dòng tiêu đề cho thông báo của các control. 
ShowMessageBox : True thì hiện thông báo động, False thì hiện thông báo tĩnh. 
ShowSummary: True là hiện thị control này khi chạy ứng dụng , False thì không (thường dùng nhất.) 
Validation Server Control 
Các sự kiện 
DataBinding() 
Disposed() 
Int() 
Load(): Lập trình sự kiện này là để đặt giá trị ban đầu cho control. 
PreRender() 
Unload()