Bi tp: Thit k website Bookstore Trng CN C Gii Ninh Bnh

Lab 2:
1. By gi ta to User Control Menu: Click phi vo th muc Controls / chon Add New tems / Chon Web
User Control / di li tn l UC_MENU.ascx / Add
+ Ti trang US_MENU.ascx / qua bn Design / nsert Table nh sau: vi rng 900px v cao 27px
+ Tip theo: ta chon vo Table sao cho du nhy nm trong th td: chn background - image cho
Table va to
Ta click phi vo Table / chon Propesties / chon Style / chon background / background-image : l hnh
bg_menu_top.jpg
lu : sa url('../../mages/bg_menu_top.jpg') thnh url('mages/bg_menu_top.jpg'
Ri OK
+ Ri sang trang Master Page. Ta ko US_MENU.ascx vo dng th 2 ca trang Master Page nh sau:
Gio i!n: Ng"#$n %nh &'n ()n: *p trnh web + Tr,ng 1
Bi tp: Thit k website Bookstore Trng CN C Gii Ninh Bnh
+ Qua Default.aspx. Nhn t hop Ctrl + F5 chy th kt qu:
2. Tip theo ta to cc link cho menu.
Goi user control HypeLink cho cc lin kt trn menu. V di tn li cho chng nh sau:
3. By gi ta vo trang Master Page / chon vj tr s 3. V chn vo dy 1 bng : 6 dng v 1 ct nh
sau :
Gio i!n: Ng"#$n %nh &'n ()n: *p trnh web + Tr,ng 2
Bi tp: Thit k website Bookstore Trng CN C Gii Ninh Bnh
+ Kt qu :
4. du tin cc bn to ch : CH SCH nh sau :
5. To mt User control mi l : UC_CD_SACH.ascx
6. Ti UC_CD_SACH.ascx goi mt GridView nh sau:
Gio i!n: Ng"#$n %nh &'n ()n: *p trnh web + Tr,ng 3
Bi tp: Thit k website Bookstore Trng CN C Gii Ninh Bnh
7. Vo Edit
8. Ta chon TemplateField v Add (chon ny l dng ty chinh hin thj theo mnh). B check Auto d
khng hin thj Columns 0, Columns 1, Columns 2
9. Click phi vo GridView, chon Properties v cho Width: 100% (nh g thm ch %)
Gio i!n: Ng"#$n %nh &'n ()n: *p trnh web + Tr,ng 4
Bi tp: Thit k website Bookstore Trng CN C Gii Ninh Bnh
10. Sau d Edit templates
11. Sau d chn bng c thng tin sau :
Cell Propeties B check Width
12. Cho 1 rng 15px v ko diu khin mage vo :
Gio i!n: Ng"#$n %nh &'n ()n: *p trnh web + Tr,ng 5
Bi tp: Thit k website Bookstore Trng CN C Gii Ninh Bnh
13. Click phi chon Propeties / Chn hnh nh tn butlet.gif nh sau :
14. cn li th ko HyperLink vo v chon Edit DataBindings..
15. V g vo Eval('' Ten_chu_de'') d hin thj thuc tnh tn ch d ca bng CH trong CSDL
Gio i!n: Ng"#$n %nh &'n ()n: *p trnh web + Tr,ng 6
Bi tp: Thit k website Bookstore Trng CN C Gii Ninh Bnh
16. By gi lm backround cho danh sch ch d : Ta chon c bng trong tem Template sau d chon
style:
17. Tm Background v chon hnh nenxanh_cottrai.gif nh sau:
Ch : xa du: ../ dng trc dng dn hnh nh di
18. Kt qu:
Gio i!n: Ng"#$n %nh &'n ()n: *p trnh web + Tr,ng 7
Bi tp: Thit k website Bookstore Trng CN C Gii Ninh Bnh
19. Nhng n vn cn tha khong trng Header du. lm mt ta click phi vo Gridview 1 d chon
Propeties / tm dn ShowHeader cho n l False
20. Tm sang trang Master Page v ngay di CH SCH ta ko UC_CD_SACH.asxc sang
21. Tip theo ko ContenPlaceHoder sang, v cho valign: top d Content nm trn cng:
TIP THEO L TO KT NI C S D LIU SQL 2005
22. By gi ta vit chui kt ni Co s d liu.
- Bn hy vo file web.config v g chui kt ni di:
Lu : Ko chut xung cui trang web.config ri g nh hnh di
Gio i!n: Ng"#$n %nh &'n ()n: *p trnh web + Tr,ng 8
Bi tp: Thit k website Bookstore Trng CN C Gii Ninh Bnh
TIP THEO L HIN TH CC CH SCH TRONG CSDL LN WEB
23. Ta sang UC_CD_SACH.ascx v click phi chon View Code
G nhng lnh sau :
- y l th vin kt ni CSDL
- Trong public partial class Controls_US_CD_SACH g lnh sau :
- Sau d to hm d hin thj cc ch d sch ln web
Gio i!n: Ng"#$n %nh &'n ()n: *p trnh web + Tr,ng 9
Bi tp: Thit k website Bookstore Trng CN C Gii Ninh Bnh
24. By gi v trang Default.aspx v nhn Ctrl + F5 v kim tra. Nu nh hnh di l OK
TIP THEO L HIN TH CC HNH QUNG CO TRONG CSDL LN WEB
25. Cc bn sang trang MasterPage. Chon ct bn phi / click phi chon Properties/ v cho valign : top
26. By gi to 1 bng tong t nh to bng d hin thj CH SCH.
Gio i!n: Ng"#$n %nh &'n ()n: *p trnh web + Tr,ng 10
Bi tp: Thit k website Bookstore Trng CN C Gii Ninh Bnh
27. trn cng to ch QUNG CO nh sau:
28. By gi ta to 1 user control mi d hin thj qung co:
Sang th muc Controls/ click phi chon Add New tem
29. Chon Web User Control / Sa tn l: UC_QUANG_CAO.ascx
Gio i!n: Ng"#$n %nh &'n ()n: *p trnh web + Tr,ng 11
Bi tp: Thit k website Bookstore Trng CN C Gii Ninh Bnh
30. Tip tuc vo phn Design ca User Controls UC_QUANG_CAO. Ko diu khin GirdView sang/
Chon Editv Add TemplateField ri OK nh hnh sau:
31. Chon GridView d/ click phi chon Propeties v cho width 100% th n s rng ra.
32. Sau d ta chon Edit template. Ri ko mage vo. Cho rng 200px. Ri chon Edit DataBindings
Gio i!n: Ng"#$n %nh &'n ()n: *p trnh web + Tr,ng 12
Bi tp: Thit k website Bookstore Trng CN C Gii Ninh Bnh
33. Lm nh hnh.
- Chon mageUrl. V g:( dng dn th muc dt hnh qung co + tn hnh trong CSDL.
Lu : g chnh xc.
34. Ta chon UC_QUANG_CAO.ascx v click phi chon View Code
G nhng lnh sau :
- y l th vin kt ni CSDL
Gio i!n: Ng"#$n %nh &'n ()n: *p trnh web + Tr,ng 13
Bi tp: Thit k website Bookstore Trng CN C Gii Ninh Bnh
- Trong public partial class Controls_US_QUANG_CAO g lnh sau :
- Sau d to hm d hin thj cc qung co ln web
- sau d goi hm thc thi
35. Ko user controls UC_QUANG_CAO.ascx sang nh hnh :
Gio i!n: Ng"#$n %nh &'n ()n: *p trnh web + Tr,ng 14
Bi tp: Thit k website Bookstore Trng CN C Gii Ninh Bnh
36. Kt qu. Nhn Ctrl + F5 xem, nu nh hnh sau th OK.
37. Tip theo l to link lin kt cho cc hnh qung co :
- Cc bn sang source ca UC_QUANG_CAO.ascx
G th a cho images
Gio i!n: Ng"#$n %nh &'n ()n: *p trnh web + Tr,ng 15
Bi tp: Thit k website Bookstore Trng CN C Gii Ninh Bnh
- Kt qu l : khi click vo hnh th s sang trang ca cng ty khc.
Gio i!n: Ng"#$n %nh &'n ()n: *p trnh web + Tr,ng 16