Quản trị website - Chương 3: Các điều khiển WebServer

Nội dung text: Quản trị website - Chương 3: Các điều khiển WebServer

1. Chương 3 Các ðiu Khin WebServer 1. Tng quan v ASP.Net Server Control 2. HTML Control 3. WebSever Control 4. Các điu khin khác 5. ði tưng ViewState 11 Written by: Dương Thành Pht
2. 2. HTML Control
   HTML Control đưc to ra t các tag HTML tĩnh thưng đưc s dng lp trình phía client
   Khi s dng HTML Control đ lp trình phía Server ta gán thuc tính runat="Server" cho HTML Control đĩ đưc gi là HTML Server Control. 22 HTML Control trên Toolbox Written by: Dương Thành Pht
3. 2. HTML Control
   ð chuyn các HTML Control thành các HTML Server Control, ta chn Run As Server Control t menu ng cnh hoc gán thuc tính runat=“Server” cho HTML Control 33 Written by: Dương Thành Pht
4. 3. ASP.NET Webserver Control Nhng lý do nên s dng Standard Web Control:
   ðơn gin, tương t như Windows Form Controls.
   ðng nht: Cĩ các thuc tính ging nhau  d tìm hiu và s dng.
   Hiu qu: T đng phát sinh ra các tag HTML theo tng loi Browser 44 Written by: Dương Thành Pht
5. 3. ASP.NET Webserver Control Thuc tính Ý nghĩa (ID) Tên ca điu khin. Tên ca điu khin là duy nht. AccessKey Ký t đ di chuyn nhanh đn điu khin phím nĩng. Attributes Tp hp các thuc tính ca điu khin HTML BackColor Màu nn ca điu khin. BorderColor Màu đưng vin ca điu khin. BorderStyle Kiu đưng vin ca điu khin. BorderWidth ð rng ca đưng vin. CssClass Hình thc hin th ca điu khin qua tên CSS. Enabled ðiu khin cĩ đưc hin th hay khơng. Mc đnh là True. Font Font hin th cho điu khin ForeColor Màu ch hin th trên điu khin Height Chiu cao ca điu khin ToolTip Dịng ch s hin th khi rê chut vào điu khin. Width ð rng ca điu khin. 55 Bng lit kê các thuc tính chung ca các Web control Written by: Dương Thành Pht
6. 3. ASP.NET Webserver Control 3.1. Label ðưc s dng đ hin th và trình bày ni dung văn bn, chp nhn hin th ni dung vi các tag HTML. Ví d: lblA.Text = "ðây là chui văn bn thưng"; lblB.Text =" Cịn đây là chui đưc in đm "; 66 Written by: Dương Thành Pht
7. 3. ASP.NET Webserver Control 3.2 TextBox ðưc dùng đ nhp và hin th d liu văn bn. Các thuc tính : Text: Ni dung cha trong Textbox TextMode: SingleLine: Hin th và nhp liu 1 dịng MultiLine: Hin th và nhp liu nhiu dịng Password: Hin th du * thay cho các ký t. Rows: S dịng hin th nu textbox cĩ nhiu dịng. Maxlength: S ký t ti đa đưc nhp Wrap: Văn bn cĩ đưc phép t đng xung dịng khi đ rng ca textbox khơng đ. 77 Written by: Dương Thành Pht
8. 3. ASP.NET Webserver Control 3.3. Image ðưc dùng đ hin th hình nh lên trang Web. Các thuc tính: ImageURL: ðưng dn tp tin hình nh. AlternateText: Chui văn bn s hin th chú thích. ImageAlign: V trí hin th gia hình và ni dung. NotSet,Left, Middle,TextTop,Right 88 Written by: Dương Thành Pht
9. 3. ASP.NET Webserver Control 3.4. Button, ImageButton, LinkButton Mc đnh là các nút Submit Button, khi đưc nhn vào s PostBack v Server. Các thuc tính: Text: Chui văn bn hin th trên điu khin. CommandName: Tên lnh đưc s dng trong s kin Command. Ngồi nhng thuc tính trên, điu khin ImageButton cịn cĩ các thuc tính ImageURL, ImageAlign và AlternateText như điu khin Image. 99 Written by: Dương Thành Pht
10. Ví d: To trang web vi các điu khin: Label, Textbox, Button thc hin chc năng tính tốn như sau: X lý s kin: protected void btTinhtien_Click(object sender, EventArgs e) { int soluong=int.Parse(txtSoluong.Text ); int dongia=int.Parse(txtDongia.Text ); int Thanhtien=soluong * dongia; txtThanhtien.Text = Thanhtien.ToString(); } 01 01 Written by: Dương Thành Pht
11. 3. ASP.NET Webserver Control 3.5. HyperLink ðưc s dng đ to ra các liên kt siêu văn bn. Các thuc tính: ImageURL: Tp tin nh hin th trên điu khin. Text: Nhãn văn bn hin th trên điu khin. NavigateUrl: ðưng dn cn liên kt đn. Target: Xác đnh ca s s hin th cho mi liên kt _blank: Hin th trang liên kt ca s mi. _self: Hin th trang liên kt ti ca s cha liên kt _parent: Hin th trang liên kt frame cha. 11 11 Written by: Dương Thành Pht
12. Ví d: To trang web gm 3 điu khin Hyperlink 21 21 Written by: Dương Thành Pht
13. 3. ASP.NET Webserver Control 3.6. Listbox và DropdownList Là điu khin hin th danh sách la chn, cĩ th chn mt hoc nhiu. Các thuc tính: + AutoPostBack: Cĩ t đng PostBack v Server khi ch s ca mc chn b thay đi. Mc đnh False + Items: Tp cha các mc chn ca điu khin. thêm vào mc chn qua thuc tính ListItem Collection Editor. + Rows: Chiu cao ca ListBox theo s dịng. + SelectionMode: Cách chn các mc trong ListBox. Single: Ch chn mt mc cĩ trong danh sách. Multiple: Cho phép chn nhiu mc. 31 31 Written by: Dương Thành Pht
14. Tp hp Items Add: Thêm mc mi vào cui danh sách Items.Add( ); Insert: Thêm mc mi vào danh sách ti mt v trí Items.Insert( , ); Count: Tr v s mc (Item) cĩ trong danh sách. Items.Count; Remove: Xĩa đi tưng Item ti ra khi danh sách. Items.Remove( ); RemoveAt: Xĩa item ti v trí index khi danh sách. Items.RemoveAt( ); Clear: Xĩa tt c Item cĩ trong danh sách. Items.Clear(); 41 41 Written by: Dương Thành Pht
15. X lý mc chn Thuc tính Selected ca đi tưng Items[i] đ kim tra xem mc th i đĩ cĩ đưc chn hay khơng. SelectedIndex: Cho bit ch s ca mc đưc chn. Trong trưng hp chn nhiu mc SelectedIndex s tr v ch s mc chn đu tiên. SelectedItem: Cho bit mc đưc chn. Trong trưng hp chn nhiu mc, SelectedItem s tr v mc chn đu tiên. SelectedValue: Cho bit giá tr ca mc đưc chn. Trong trưng hp chn nhiu mc, SelectedValue s tr v giá tr mc chn đu tiên. 51 51 Written by: Dương Thành Pht
16. Ví d: To trang Web gm 1 listbox, 2 label , 1 Button khi click nút chn s hin tên các đa danh đưc chn. 61 61 Written by: Dương Thành Pht
17. X lý s kin: protected void Page_Load(. . . ) { if (!IsPostBack) { lstDiadanh.Items.Add("Vnh H Long"); lstDiadanh.Items.Add("Phan Thit Mũi Né"); lstDiadanh.Items.Add("Nha Trang"); lstDiadanh.Items.Add("ðà Lt"); lstDiadanh.Items.Add("Phú Quc"); lstDiadanh.Items.Add("Hu Hi An"); int n = lstDiadanh.Items.Count; lbSoDD.Text = n.ToString(); } } protected void btChon_Click(. . .) { lbDiadanh.Text = ""; for (int i = 0; i " + lstDiadanh.Items[i].Value; } 71 71 } Written by: Dương Thành Pht
18. 3. ASP.NET Webserver Control 3.7. Checkbox, RadioButton Các thuc tính Checked: Trng thái ca mc chn (chn hay khơng) TextAlign: V trí ca điu khin so vi chui văn bn. AutoPostBack: Cĩ đưc t đng PostBack v Server khi các mc chn b thay đi, mc đnh là False. GroupName (RadioButton): Tên nhĩm, thuc tính này đưc s dng đ nhĩm các điu khin RadioButton li thành 1 nhĩm. 81 81 Written by: Dương Thành Pht
19. Ví d: To trang web gm Nhĩm các RadioButton Gii tính, Thu nhp, Nhĩm Checkbox Ngoi ng 91 91 Written by: Dương Thành Pht
20. 3. ASP.NET Webserver Control 3.8. CheckBoxList, RadioButtonList  Dùng đ to ra mt nhĩm các CheckBox/Radio Button, Là điu khin danh sách nên cĩ thuc tính Items cha tp hp các mc chn như ListBox/DropDownList.  Các thao tác trên tp hp Items, x lý mc chn cũng tương t như ListBox/DropDownList. To mi: Kéo th RadioButtonList (Hoc CheckbocList) vào Form  Chn Edit Items 02 02 Written by: Dương Thành Pht
21. Các thuc tính RepeatColumns: S ct hin th. RepeatDirection: Hình thc hin th Vertical: Theo chiu dc Horizontal: Theo chiu ngang AutoPostBack: Cĩ đưc phép t đng PostBack v Server khi các mc chn ca điu khin b thay đi. Mc đnh là False. 12 12 Written by: Dương Thành Pht
22. Ví d: To trang web gm Nhĩm RadioButton Thu nhp X lý s kin: Private Sub rblThu_nhap_SelectedIndexChanged( ) lblThu_nhap.Text = "Bn chn thu nhp: " + rblThu_nhap.SelectedItem.Text; End Sub 22 22 Written by: Dương Thành Pht
23. Ví d: To trang web khi click nút ðăng ký thì hin th các thơng tin đưc chn. 32 32 Written by: Dương Thành Pht
24. 4. Các điu khin khác 4.1. ðiu khin Literal Tương t như điu khin Label, Literal đưc s dng đ hin th chui văn bn trên trang Web. ðim khác bit là khi thi hành, Literal khơng to thêm tag Html, cịn Label s to ra tag span (đưc s dng đ lp trình phía client). 42 42 Written by: Dương Thành Pht
25. Ví d: Khi thit k. Lnh x lý: protected void Page_Load(object sender, EventArgs e) { Label1.Text=" ðây là chui ký t trong label "; Literal1.Text = " ðây là chui ký t trong Literial "; } Xem source: ðây là chui ký t trong label ðây là chui ký t trong Literial 52 52 Written by: Dương Thành Pht
26. 4. Các điu khin khác 4.2. ðiu khin AdRotator ðưc dùng đ to ra các nh qung cáo (ti 1 vùng s cĩ nhiu nh, xut hin theo tun xut), nĩ t đng thay đi các hình nh mi khi cĩ yêu cu (PostBack v server). 62 62 Written by: Dương Thành Pht
27. Thuc tính AdvertisementFile: Tên tp tin d liu (dưi dng xml) cho điu khin. Cú pháp ca tp tin Advertisement (*.xml) ðưng dn tp tin hình nh ðưng dn liên kt Chui văn bn Tooltip T khĩa dùng đ lc hình nh Tn sut hin th ca nh Lưu ý: Các giá tr cĩ phân bit ch Hoa ch thưng 72 72 Written by: Dương Thành Pht
28. b. S kin AdCreated: Xy ra khi điu khin to ra các qung cáo 82 82 Written by: Dương Thành Pht
29. Ví d: To mu Quangcao s dng điu khin AdRotator Bưc 1. Thit k giao din Bưc 2. To tp tin d liu: Quangcao.xml S dng chc năng Add New Item t thc đơn ng cnh Chn XML File trong hp thoi Add New Item 92 92 Written by: Dương Thành Pht
30. Nhp vào ni dung cho tp tin Quangcao.xml Pictures\Baihatviet.gif Web Nhc bài hát vit Music 10 03 03 Written by: Dương Thành Pht
31. Chuyn màn hình qua trang Data, nhp liu trc tip: Click phi màn hình đang code chn View Data Grid 13 13 Written by: Dương Thành Pht
32. Bưc 3. Thit lp thuc tính cho điu khin adQuangcao AdvertisementFile: Quangcao.xml Target: _blank KeywordFilter: Khơng thit lp (Hin th tt c nh) Bưc 4. Thi hành ng dng 23 23 Written by: Dương Thành Pht
33. 4. Các điu khin khác 4.3. ðiu khin Calendar Dùng đ hin th và cp nht d liu kiu ngày 33 33 Written by: Dương Thành Pht
34. Thuc tính DayHeaderStyle: Tiêu đ ca các ngày trong tun DayStyle: Các ngày trong điu khin. NextPrevStyle: Tháng trưc/sau ca tháng đang chn. SeleltedDayStyle : Ngày đang đưc chn. TitleStyle: Tiêu đ ca tháng đưc chn TodayDayStyle: Ngày hin hành (trên server). WeekendDayStyle: Các ngày cui tun (th 7, ch nht) OtherMonthDayStyle: Các ngày khơng nm trong tháng hin ti. SelectedDate: Giá tr ngày đưc chn trên điu khin 43 43 Written by: Dương Thành Pht
35. b. S kin SelectionChanged: S kin này xy ra khi chn mt ngày VisibleMonthChanged: X kin xy ra khi chn mt tháng 53 53 Written by: Dương Thành Pht
36. Ví d: To Calendard trên trang web Bưc 1: To Calendard vào trang Bưc 2: Chn mu đnh dng: Click phi /Auto Format 63 63 Written by: Dương Thành Pht
37. X lý s kin: protected void Page_Load(object sender, EventArgs e){ lbNgay.Text = "Hơm nay ngày " + DateTime.Today.ToString ("dd/MM/yyyy"); } protected void Calendar1_SelectionChanged1( . . . .) { lbThongbao.Text ="Bn đang chn " + Calendar1.SelectedDate.ToString("dd/MM/yyyy"); } 73 73 Written by: Dương Thành Pht
38. 4. Các điu khin khác 4.4. ðiu khin File Upload. S dng Upload file t chính ng dng Web. File sau khi Upload cĩ th lưu tr 1 nơi nào đĩ trên webserver. Thuc tính Ý nghĩa Enable Vơ hiu hố điu khin FileUpload. FileBytes Ly ni dung file đã đưc upload như mt mng Byte. FileContent Ly ni dung ca file đã đưc upload theo dịng d liu FileName Ly tên file đưc Upload HasFile Tr v giá tr true khi File đưc Upload 83 83 Written by: Dương Thành Pht
39. Các phương thc: Focus: Chuyn con tr đn điu khin FileUpload. SaveAs: Cho phép lưu file đưc upload lên h thng. 93 93 Written by: Dương Thành Pht
40. Ví d: To điu khin File Upload Thit k và to FileUpload vào trang X lý s kin: protected void Button1_Click(object sender, EventArgs e) { string sTenfile ; //Tách ly tên tp tin sTenfile = FileUpload1.FileName; //Thc hin chép tp tin lên thư mc Upload FileUpload1.SaveAs(MapPath("~/Upload/" + sTenfile)); lbThongbao.Text = "ðã upload thành cơng" ; } 04 04 Written by: Dương Thành Pht
41. 4. Các điu khin khác 4.5. ðiu khin Panel và PlaceHolder  S dùng đ cha các điu khin khác.  Thuc tính Visible= True thì các điu khin cha bên trong s đưc hin th và ngưc li. Tuy nhiên, điu khin Panel cho phép chúng ta kéo nhng điu khin vào bên trong nĩ lúc thit k, cịn điu khin PlaceHolder thì khơng. 14 14 Written by: Dương Thành Pht
42. Thuc tính DefaultButton: ðnh nghĩa button mc đnh trong panel (s đưc thc hin khi nhn Enter) Direction: Thit đt hưng hin th ni dung đưc đưa ra trong panel:NotSet, LeftToRight, RightToLeft. GroupingText: Trình bày Panel như 1 Fieldset vi mt chú gii riêng bit. HorizontalAlign: Ch ra hưng ngang th hin ni dung ca panel:Center, Justify, Left, NotSet, Right. ScrollBars: Hin th scrollbars khi ni dung trong panel vưt quá kích thưc: Auto, Both, Horizontal, None, Vertical. 24 24 Written by: Dương Thành Pht
43. Ví d: To trang s dng Panel Thit k: 34 34 Written by: Dương Thành Pht
44. X lý s kin: protected void Page_Load(object sender, EventArgs e) { for (int i = 1; i < 100; i++) { buletnghenghiep.Items.Add("Ngh "+i.ToString()); } } protected void chkhtsothich_CheckedChanged(. . . .) { if (chksothich.Checked == true) panelsothich.Visible = true; else panelsothich.Visible = false; } protected void chkhtnghenghiep_CheckedChanged(. . . ) { if (chknghenghiep.Checked == true) panelnghenghiep.Visible = true; else panelnghenghiep.Visible = false; 44 44} Written by: Dương Thành Pht
45. 4. Các điu khin khác 4.5. ðiu khin hin th các trang – View và MultiView Cho phép n hoc hin các phn khác nhau ca trang Web, tin ích khi to mt TabPage đ chia 1 trang web cĩ đ dài ln thành các phn đ hin th. ðiu khin MultiView cha đng 1 hoc nhiu điu khin View. 54 54 Written by: Dương Thành Pht
46. Thuc tính  ActiveViewIndex : La chn điu khin View đưc đưa ra hin th bng ch s Index  Views: Cho phép ly v tp hp các điu khin View cha đng trong điu khin MultiView. Phương thc  GetActiveView: Cho phép ly v thơng tin ca điu khin View đưc la chn.  SetActiveView : Cho phép thit lp điu khin View đưc hin th. S kin  ActiveViewChanged: Khi điu khin View đưc 64 64 chn Written by: Dương Thành Pht
47. Ví d: To trang s dng MultiView Thit k:
    To 1 Multiview1 gm 3 View (View1 View2, View3)
    To Control Menu1 gm 3 Tab (Tab1, Tab2, Tab3) To Control Menu vào Form 74 74 Written by: Dương Thành Pht
48. Chn Edit Menu Item Ln lưt khái báo các nhãn (Text) là: Tab 1, Tab 2, Tab 3 và các giá tr (Value) tương ng là: 0 , 1, 2 Thuc tính Orientation: Horizaltal (Menu hưng ngang) 84 84 Written by: Dương Thành Pht
49. B sung ni dung vào các view tương ng 94 94 Written by: Dương Thành Pht
50. X lý s kin: void Menu1_MenuItemClick(object sender, MenuEventArgs e){ int index = int.Parse(e.Item.Value); MultiView1.ActiveViewIndex = index; } void Page_Load(object sender, EventArgs e){ if (!IsPostBack){ MultiView1.ActiveViewIndex = 0; } } 05 05 Written by: Dương Thành Pht
51. 5. ði tưng ViewState  ðưc cung cp đ lưu li nhng thơng tin ca trang web sau khi web server gi kt qu v cho Client.  Mc đnh, trang web s cho phép s dng đi tưng ViewState thơng qua thuc tính EnableViewState = True Gán giá tr cho ViewState: ViewState("Tên trng thái") = ; Nhn giá tr t đi tưng ViewState: = ViewState("Tên trng thái"); 15 15 Written by: Dương Thành Pht
52.  V bn cht, các giá tr trong đi tưng ViewState đưc lưu trong mt điu khin hidden và các giá tr này đã đưc mã hĩa.  ði tưng ViewState giúp gim bt cơng sc trong vic lưu tr và truy xut các thơng tin mà khơng phi s dng nhiu điu khin hidden 25 25 Written by: Dương Thành Pht
53. Ví d: X lý s kin: protected void btDem_Click(object sender, EventArgs e) { lbThongbao.Text = Convert.ToString(int.Parse(lbThongbao.Text)+1); } 35 35 Written by: Dương Thành Pht
54. Xem Source 45 45 Written by: Dương Thành Pht