:
– Cũng là một thẻ trung hòa
– Dùng để nhóm một hoặc nhiều khối phần tử
Ví dụ
3.2 Web server control
• Khái niệm
• Cách tạo
• Thứ bậc
• Các Control cơ bản
• Các Control đặt biệt
Khái niệm
• 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ách tạo
• Cú pháp:
• Ví dụ:
Hệ thống thứ bậc của Web Server Control
System.Object
System.Web.UI.Control
Repeater
Xml
WebControl
AdRotator
LinkButton
Image
ListControl
BaseDataList
ImageButton
RadioButtonList
Label
DataGrid
CheckBoxList
BaseValidator
DataList
DropDownList
BaseCompareValidator
Button
ListBox
Calendar
CompareValidator
Panel
CheckBox
RangeValidator
Table
RadioButton
CustomValidator
TableCell
HyperLink
RegularExpressionValidator
TableHeaderCell
TextBox
RequiredFieldValidator
TableRow
ValidationSummary
Các Control cơ bản
• Label
• Textbox
• Button
• CheckBox
• Radio
Image
•
• Hyperlink
• List Controls group
• Table
• BulletedList
Label
• Dùng hiển thị văn bản trên trình duyệt
• Thuộc tính:
– ID: tên cho label
– Khác: Tự nghiên cứu
• Ví dụ:
TextBox
Dùng để nhập liệu hoặc 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
– TextMode: SingleLine, MultiLine, Pass
– Value: Gán giá trị
– ReadOnly: Dữ liệu không thay đổi
– Khác: Tự nghiên cứu
• Sự kiện: Tự nghiên cứu
Button
• Thường sử dụng để submit form
• Phân loại:
– Button
– LinkButton
– ImageButton
• Sự kiện
– Onclick()
– OnserverClick()
Button
CheckBox
• Các thuộc tính:
o
Type
o
Id
o Text
o
o
o
o
o
"checkbox"
tên checkbox
Nhãn
.Checked = True/False
.Item[n].Selected=True/False
. SelectedItem
. SelectedValue
. SelectedIndex
Checked
Item[n].Selected
SelectedItem
SelectedValue
SelectedIndex
• Sự kiện:
Onclick()
Onserverclick ()
–
–
CheckBox
protected void btnSubmit_Click(object sender, EventArgs e)
{
string maudachon = " ";
if (maudo.Checked)
{ maudachon = "Đỏ "; }
if (mauxanh.Checked)
{ maudachon = "Xanh "; }
if ((maudo.Checked) && (mauxanh.Checked))
{ maudachon = "Đỏ Xanh "; }
if (Page.IsPostBack)
{ lbltext.InnerHtml = “Bạn chọn màu: " + maudachon; }
}
RadioButton
• Thuộc tính:
o
o
o
o
o
o
o
Type
Id
Text
Checked
SelectedItem
SelectedValue
SelectedIndex
"RadioButton"
tên RadioButton
Nhãn
.Checked = True/False
. SelectedItem
. SelectedValue
. SelectedIndex
• Sự kiện
onClick()
onCheckedChanged()
–
–
image
Type: Image •
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
Xem thêm ImageButton
PostBackUrl
• Height: Chiều cao
• Width: Chiều rộng
ToolTip: Thông báo khi rà mouse •
HyperLink
•
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 •
ListControl
• DropDownList
• ListBox
• CheckBoxList
• RadioButtonList
ListControl
ListBox DropDownList CheckBoxList RadioButtonList
Quảng Ngãi
Đà Nẳng
Item: có thể được tạo theo cách Coding hoặc Design
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.
Thuộc tính và sự kiện
• 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
Dữ liệu cho ListControl
• 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
Table
• 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
• Tạo Table : Disgin hoặc Code
ASP ControlHTML HTMLControl
Table
TableRow
TableHeaderCell
TableCell
|
ASP ControlHTML
Cột 1
Cột 2
Cột 3
c1
c2
HTMLControl
cột 1 |
Cột 2 |
Cột 3 |
|
|
|
|
|
|
BulletedList
BulletStyle="Numbered" DisplayMode="Text" >
Các Control đặt biệt
• Panel
• FileUpload
• Calendar
• AdRotator
• Validation
• Wizard
Panel
•
•
Được dùng như ContainerControl đối với các control
khác
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 •
FileUpload
• 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
– Hasfile: True/False tồn tại file không
– FileBytes: Mảng bytes chứa nội dung file upload
– PostedFile.Filename: Đường dẫn đầy đủ của file
– PostedFile.ContentType: Loại File (.doc, .mdb, …)
– PostedFile.ContentLength: Kích thước của File.
• Các phưong thức:
– SaveAs: Lưu file upload vào 1 thư mục bất kỳ
– MapPath(): Trả về đường dẫn ảo của web server
– PathGetExtension(): Trả về pahàn mở rộng của file
Ví dụ
lblfile.Text = FileUpload1.PostedFile.FileName.ToString();
lbltype.Text = FileUpload1.PostedFile.ContentType.ToString();
lblsize.Text = FileUpload1.PostedFile.ContentLength.ToString();
string filename;
filename = FileUpload1.PostedFile.FileName.ToString();
FileUpload1.PostedFile.SaveAs(Server.MapPath("")+"\\bai2.3"+filename);
Nên viết Code Bihind
Calendar
• Cú pháp:
FirstDayOfWeek="Monday"
SelectedDate="2011-09-26"
onselectionchanged="layngay">
• Các thuộc tính:
– DayNameFormat: Định dạng
– FirstDayOfWeek: Quy định ngày đầu tuần
– SelectedDate: Lấy về hoặc thiết đặt cho ngày lựa chọn
– .SelectedDate.
ToLongDateString()>;
– .SelectedDate..ToString();
AdRotator
• Ý nghĩa: Dùng 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
– AdvertisementFile: file.xml
– Height
– Width
Image/hinh1.gif
http://www.microsoft.com
Alt Text
Validation
• RequiredFieldValidator
• Range Validator
• RegularExpressionValidator
• CompareValidator
• CustomValidator
• ValidationSummary
RequiredFieldValidator
• Ý nghĩa: Yêu cầu người dùng phải nhập liệu
• Cú pháp:
– true thì hiểu các script ở phía client
– false thì không
ErrorMessage="Bạn phải nhập dữ liệu"
ControlToValidate="txtsoa"
Display="Dynamic"
EnableClientScript =
Initialvalue = Giá trị khởi tạo />
Range Validator
• Ý nghĩa:
– 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:
• giới hạn này có thể đượ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
• Cú pháp:
RegularExpressionValidator
• Ý nghĩa:
– 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
• Cú pháp:
ErrorMessage="thông báo"
ControlToValidate="Id của control cần kiểm tra "
Display="Dynamic"
ValidationExpression="biểu thức định dạng" />
• Xác định file ảnh:
"^([0-9a-zA-Z_\-~
:\\])+(.jpg|.JPG|.jpeg|.JPEG|.bmp|.BMP|.gif|.GIF|.png"
"^\d+$" hoặc "^\d{n}" • Xác định số:
"[0-9]+" • Ký tự là số:
• Lưu ý: *, ?
CompareValidator
• Ý nghĩa: So sánh dữ liệu nhập với một trị hoặc hằng cho
trước hoặc một giá trị trong dữ liệu
• Cú pháp:
ErrorMessage="errormessage"
ControlToValidate= " Id của control cần kiểm tra "
ControlToCompare= " Id của control kiểm tra "
Type="Integer"
Operator="Equal"
ValueToCompare= "giá trị" />
CustomValidator
• Ý nghĩa: 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 đó
ErrorMessage="errormessage"
ControlToValidate="tên ID cần kiểm tra"
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 (javascript)
onservervalidate="CustomValidator1_ServerValidate" />
protected void CustomValidator1_ServerValidate(object source,
ServerValidateEventArgs args)
{ if (args.Value.Length>5)
{ args.IsValid = true; }
else
{ args.IsValid = false; } }
• Cú pháp:
ValidationSummary
• Ý nghĩa:
– Cho phép bạn liệt kê tất cả các các lỗi kiểm tra trên trang từ
những điều khiển validator vào một vị trí.
– Điều khiển này đặc biệt tiện ích với Form có độ rộng lớn
• Cú pháp:
• Thuộc tính:
– DisplayMode: Cho phép bạn chỉ rõ định dạng hiển thị lỗi, nó có
thể là các giá trị như BulletList, List, và SingleParagraph
– HeaderText: Cho phép bạn hiển thị tiêu đề tóm tắt cho các lỗi
– ShowMessageBox: Cho hiện thị một popup thông báo
– ShowSummary: Cho phép bạn ẩn ValidationSummary trên trang.
Wizard
• Ý nghĩa: Tạo các bước để dẫn dắt người dùng qua một
dãy màn hình nhằm thu thập thông tin
• Các thuộc tính quan trọng:
– WizardStep
– StepType : Start; Step; Finish; Complete
• Các sự kiện:
– Onfinishbuttonclick: Xảy ra khi nút Finish được Click
– OnActiveStepChanged: Xảy ra khi thay đổi các bước
hiển thị
Tạo ứng dụng
2
1
3
5
• Viết code cho các
4
• Viết code cho sự kiện
Onfinishbuttonclick
3.3. Client-Side Callback
• Sinh viên tự nghiên cứu
Có thể bạn quan tâmTài liêu mới
|