Bài giảng Lập trình Web ASP.NET: Chương 3 - ĐH Lạc Hồng

Tr

ng

ai Hoc Lac Hông 2009 - 2010

LÂP TRINH
WEB ASP.NET
Ts. Vu
c Lung
Ks. Huynh Cao Tuân
Ks. Phan H u Tiêp

iT
1

Ch
ng 3:
ng Trong ASP.NET


LHU


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

Web service conntrols
 Nghiên c u HTML Control
 Nghiên c u ASP.NET Web Control

2

http:// lhu.edu.vn


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

HTML Control
 Dùng đ th hi n giao di n web
 T t c các class HTML control ch a trong
namespace System.Web.UI.HtmlControls
 HTML Server control là nh ng tag HTML t o
ra
 Duy trì t ng thích v i các tag HTML c .
 Thêm vào thu c tính run at = “server”
 T t c HTML Server Control ph i đ c đ t
trong
 Tag <form> v i thu c tính run at = “server”

3

http:// lhu.edu.vn


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

ASP.NET Web Control
 ASP.NET Server Control là nh ng tag đ c bi t c a riêng ASP.NET.
 Các control này c ng s đ c x lý trên server, và địi h i ph i có
thu c tính runat = “server”
 Khơng t ng ng v i HTML tag nào.
 Có th dùng th hi n các thành ph n ph c t p.
 Nôi dung nghiên c u:
 ASP.NET Page
 Cac điêu khiên c ban

4

http:// lhu.edu.vn


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

ASP.NET Page
ây la phân chi nh cua giao diên, la n i ch a cac điêu khiên
đ c s dung đê thê hiên nôi dung trang web đên ng i dung
 S kiên:



Page_Init()
Page_Load()
Page_PreRender()

Page_Unload()

5

http:// lhu.edu.vn


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

ASP.NET Page
 Init: s kiên Page_Init xay ra đâu tiên khi trang web đ c yêu câu
 Load: s kiên nay la n i ta se đ t phân l n cac x ly , gia tri kh i
đông ban đâu cho trang web. S kiên nay luôn xay ra môi khi trang
web đ c yêu câu.
 PreRender: S kiên nay xay ra khi trang web chuân bi đ c tra vê
cho Cilent
 Unload: S kiên nay đôi lâp v i s kiên Page_Init xay ra đâu tiên
khi trang web đ c yêu câu, thi Page_Unload la s kiên sau cung,
xay ra sau tât ca nh ng s kiên khac.

6

http:// lhu.edu.vn


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

Cac thuôc tinh trong ASP.NET Page
 IsPostBack: đây la thuôc tinh kiêu Boolean, gia tri cu a thuôc
ti nh nay cho biêt trang thai cua trang web khi đ c load. Nêu
la lân load đâu tiên, gia tri cu a thuôc tinh nay b ng False.
Thuôc tinh nay th ng đ c s du ng trong s
kiên
Page_Load đê kiêm tra trang thai cua trang web
 SmartNavigation: trong tr ng h p nôi dung trang web v t
qua ki ch th c hiên thi cua man hinh va ban đang đoc phân
gi a cua trang web, khi đ c Reload lai, man hinh se hiên thi
phân đâu cua trang web. N êu gia tri cu a thuôc tinh nay la
True, trinh duyêt web se vâ gi nguyên vi tri ma ban đang đoc
sau khi Reload. ây la thuôc tinh kiêu Boolean.

7

http:// lhu.edu.vn


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

So sanh gi a ASP.NET Server Conntrol
va HTML Control

8

http:// lhu.edu.vn

Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

Khác bi t trong HTML tag
 Server control:
 <asp:controlname id="some_id" runat="server"/>

 HTML control:
 HTML Tag

 Vi du:

9

http:// lhu.edu.vn


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

Môt sô vi du

10

http:// lhu.edu.vn

Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

ASP.NET Web Control
 ASP.NET Web ConTrol đ n gian, t ng t ca c điêu khiên
trên Windows Form
 ông nhât: Cac điêu khiên Web Server co ca c thuôc tinh
giông nhau nên dê ti m hiêu va s dung
 Hiêu qua: cac điêu khiên web server t đông phat sinh ra cac
tag HTML theo t ng loai Browser
 i u
khi n
s
ki n
và ch ng tr
ình
con
(Control events and Subroutines)
 S ki n sinh ra: b m chu t, b m phím ENTER, load 1 trang
web…=>B s lý s ki n – Handler
<form runat="server">

<asp:Label id="lblMessage" runat="server" />
</form>
11

http:// lhu.edu.vn

Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

ASP.NET Web Control
Cac s kiên th ng g p
 OnClick, OnCommand, OnLoad
 OnInit
 OnPreRender: đ c x y ra sau khi Control đ c n p, và
tr c khi control đ c render (t c là hi n th ra client/browser
 OnUnLoad
 OnDispose: button đ c gi i phóng kh i b nh
 OnDataBinding

12

http:// lhu.edu.vn


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

ASP.NET Web Control
Thu c tính

Ki u

Ý ngh a

ID
Chu i KT Tên control, duy nh t
AccessKey
String
Ký t chuy n nhanh đ n control, phím nóng
BackColor
Color
Màu n n
BorderColor
Color
Màu đ ng vi n
BorderStyle BorderStyle ki u đ ng vi n
BorderWidth
Unit
đ r ng đ ng vi n
Visible
Boolean
Control có th y hay không, m c đ nh – true
Font
FontInfo
Font cho control
ForeColor
Color
Màu font
Height
Unit
chi u cao
Width

Unit
đ r ng
AutoPostBack
boolean
Khi đ c thi t l p là True, m i khi ng i dùng
thay đ i d li u TextChanged trong TextBox s
kích ho t s ki n post-back v server
13

http:// lhu.edu.vn


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

ASP.NET Web Control
Thu c tính
Attributes
CssClass
Enabled
ToolTip

Ki u
Ý ngh a
Attribute_Collection Tâp h p cac thuôc tinh cua điêu khiên
HTML
String
Quy đinh hinh th c thê hiên cua điêu
khiên qua tên CSS

Boolean
Quy đinh điêu khiên co đ c hiên thi hay
không hiên thi
String
Dong ch se hiên thi khi rê chuôt vao
điêu khiên

14

http:// lhu.edu.vn


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

ASP.NET Web Control
 Cac web control c ban:
Label
TextBox
Button
Image
ImageButton
LinkButton
HyperLink

RadioButton
RadioButtonList
CheckBox
CheckBoxList

DropDownList
ListBox
Panel
PlaceHolder

15

http:// lhu.edu.vn


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

ASP.NET Web Control: Label
 Label th ng đ c s dung đê hiên thi va tri nh bay nôi dung
trên trang web.
 Nôi dung hiên thi trên label đ c xac đinh thông qua thuôc tih
Text.
 Thuôc tinh Text co thê nhân va hiên thi nôi dung v i cac Tag
HTML
 Khai bao s dung label trong trang ASP.NET
<asp:Label ID="Label1“ runat="server“ Text="Label"></asp:Label>
Tên label

B t buôc co

Nôi dung trên label

16

http:// lhu.edu.vn


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

ASP.NET Web Control: Label
 Cac thuôc tinh cua Label:
 Vi du:
 lblNhan.text=“Chao ban”
 lblNhan.text=“<b>Chao ban</b>”

17

http:// lhu.edu.vn


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

ASP.NET Web Control: HyperLink
 iêu khiên nay đ
 Cac thuôc tinh:

c dung đê tao ra cac liên kêt siêu v n ban

 ImageURL: quy đinh hinh hiên thi trên điêu khiên

 Text: chuôi v n ban đ c hiên thi trê điêu khiên. Trong tr ng
h p ca hai thuôc tinh ImageURL va Text đ c thiêt lâp, thuôc
ti nh ImageURL đ c u tiên, thuôc tinh Text se đ c hiên thi
nh la môt ToolTip
 NavigateURL: đ ng dân liên kêt đên
 Target: xac đinh c a sơ se hiên thi cho mơi liên kêt
• _blank: hiên thi trên mơt c a sơ m i
• _self: hiên thi trang liên kêt tai c a sô hiên tai
• _parent: hiên thi trang liên kêt tai frame cha

18

http:// lhu.edu.vn


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

ASP.NET Web Control: HyperLink
 Cach khai bao:
HyperLink </asp:HyperLink>
Vi du:
hplLienket.text=“Trang chu ASP.NET”
hplLienket.ImageUrl=“hinh\hinhmau.jpg”
hplLienket.Navigation=“http:’//lhu.edu.vn”
hplLienket.Target=“_blank”

19

http:// lhu.edu.vn


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

ASP.NET Web Control: Textbox
 Textbox la điêu khiên đ
liêu. Textbox th ng đ
trên web
 Cac thuôc tinh

c dung đê nhâp liêu va hiên thi d
c s du ng nhiêu v i cac ng dung

 Text: nôi dung ch a trong textbox
 TextMode: quy đinh ch c n ng cua textbox nh

sau:

• SingleLine: hiên thi va nhâp liêu 01 dong v ban
• MultiLine: hiên thi va nhâp liêu nhiêu dong v n ban
• Password: hiên thi dâu * thay cho cac ky t co trong textbox

 Rows: trong tr ng h p textmode=MultiLine, thuôc tinh Rows se
qui đinh sô dong v ban đ c hiên thi
 MaxLength: quy đinh sô ky t tôi đa đ c nhâp vao Textbox
 Wrap: t đông ng t lê phai va xuông dong

20

http:// lhu.edu.vn


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

ASP.NET Web Control: Textbox
 Cac thuôc tinh tiêp theo:
 AutoPostBack: thuôc tinh nay
qui đinh điêu khiên co đ c
phep t
đông PostBack vê
Server khi nôi dunng trong
Textbox bi thay đôi hay không.
Thuôc tinh nay co gia tri
boolean
 Khai bao textbox:
runat="server"></asp:textbox>

21

http:// lhu.edu.vn


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

ASP.NET Web Control: Image
 iêu khiên nay dung đê hiên thi hi nh anh lên trang web
 Thuôc tinh:
 ImageURL: đ ng dân đên tâp tin hinh anh cân hiên thi
 AlternateText: chuôi v n ban se hiên thi khi tâp tin đ c thiêt lâp
trong thuôc tinh ImageURL không tôn tai
 ImageAlign: vi tri hiên thi gi a hinh va nơi dung v n ban
•
•
•
•
•

NotSet
Left
Middle
TextTop
Right

22

http:// lhu.edu.vn


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

ASP.NET Web Control: Button, Image Button,
LinkButton

 Cac điêu khiên Button, Image Button , LinkButton m c đinh
đêu la nu t submit button, môi khi đ c nhân se PostBack vê
Server
 Khi chung ta thiêt lâp gia tri thuôc tinh CommandName cho
cac điêu khiên nay, chung ta goi tên chung cho cac điêu khiên
la Command Button
 Cac thuôc tinh th ng s dung:
 Text: chuôi v n ban hiên thi trên điêu khiên
 CommandName: tên lênh, đ
c s du ng trong s
kiên
Command
 CommandArgument: thông tin bô sung cho s kiên Command
 CausesValidation: trang web m c đinh kiêm tra tinh h p lê d
liêu môi khi đ c PostBack. Gia tri m c đinh la True
23

http:// lhu.edu.vn


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

ASP.NET Web Control: Button, Image Button,
LinkButton

24

http:// lhu.edu.vn


Ts. Vu

c Lung – Ks. Huynh Cao Tuân - Ks. Phan H u Tiêp

ASP.NET Web Control: Listbox, DropDownList

 Listbox va DropDownList la điêu khiên danh sach l a chon
ma ng i dung co thê chon môt hay nhiêu(Chi danh riêng cho
listbox). Cac muc l a chon co thê thêm vao danh sach thông
qua lênh hay c a sô thuôc tinh ( property windows)
 Cac thuôc tinh th ng s dung:
 AutoPostBack: thuôc tinh nay quy đinh điêu khiên co đ c phep
t đông PostBack vê server khi chi sô cu a muc chon bi thay đôi.
Gia tri m c đinh cua thuôc tinh nay la False.
 Item: đây la tâp h p ch a cac muc chon cua điêu khiên. Ta co
thê thêm vao muc chon vao th i điêm thiêt kê thông qua c a sô
ListItem Collection Editor hay thông qua lênh.
 Rows: qui đinh chiêu cao cua ListBox theo sô dong hiên thi
 SelectionMode: thuôc tinh nay xac đinh cach th c chon cac muc
trong ListBox, SelectionMode chi đ c phep thay đôi trong qua
tri nh thiêt kê
25

http:// lhu.edu.vn