3 BO CO TI

MN: CNG C V MI TRNG

PHT TRIN PHN MM

TM HIU
ASP.NET MVC 5 LOGO

Sinh vin thc hin : L Trung Tho -- MSSV: 11110126

Nguyn Th Hoa Bch MSSV: 11110009
Khoa : Cng Ngh Thng Tin
Trng : H S Phm K Thut Tp H Ch Minh
 NI DUNG
1 Gii thiu MVC v ASP.NET MVC
2 Xy dng ng dng Web vi MVC5

3 Controller
4 View

5 Model

6 Validation

7 Website Organization
Gii thiu MVC v
ASP.NET MVC 5
 MVC l g ?
MVC l mt mu thit k (design pattern) c s dng trong k
thut phn mm. Theo ng dng c chia lm 3 phn Model,
View v Controller. Mi phn c nhim v ring bit v c lp
vi cc thnh phn khc.
Mt s MVC Framework pht trin da trn m hnh MVC:
Strut, JSF, Spring,(Java)
Zend (PHP)
ASP.NET MVC

4
 Kin trc MVC
Controller:
Nhn yu cu t user
X l v xy dng model ph hp
Chuyn model sang View hin th
View: Nhn model t Controller to
giao din ph hp v hin th
Model: Cha d liu chia s gia
Controller v View

5
 u im Nhc im ca MVC
u im:
Th hin tnh chuyn nghip trong lp trnh, phn tch thit k
Pht trin ng dng nhanh, d dng, d nng cp, bo tr
Nhc im:
i vi project nh, gy cng knh, tn thi gian trong qu trnh
pht trin, tn thi gian trung chuyn d liu ca cc thnh phn

6
ASP.NET MVC vs ASP.NET WebForm

7
 ASP.NET MVC vs ASP.NET WebForm
Tnh nng ASP.NET WEBFORM ASP.NET MVC
Kin trc chng Kin trc m hnh WebForm->Business- Kin trc s dng vic phn chia chng
trnh >Database trnh thnh Controller, Model, View

C php chng S dng c php WebForm, tt c cc s kin Cc s kin c iu khin bi Controller,

trnh v control do server qun l cc control khng do server qun l

Truy cp d liu S dng hu ht cc cng ngh truy cp d liu Phn ln dng LINQ to SQL class to m
trong ng dng hnh truy cp i tng

Debug Debug chng trnh phi thc hin tt c bao Debug c th s dng cc unit test kim tra
gm cc lp truy cp d liu, s hin th, iu cc phng thc trong Controller
khin cc controls
Tc phn ti Tc phn ti chm trong khi trang c qu Phn ti nhanh hn do khng phi qun l
nhiu cc controls v ViewState qu ln ViewState qun l cc control trong trang

Tng tc vi Tng tc vi javascrip kh khn v cc controls Tng tc vi javascript d dng v cc i

javascrip c iu khin bi server tng khng do server qun l iu khin
khng kh.
URL Address Cu trc a ch URL c dng <filename> Cu trc a ch rnh mch theo dng
.aspx?& <cc tham s> Controller/Action/ID

8
Cc phin bn ASP.NET MVC
Ngy Phin Bn

10 -12- 2007 ASP.NET MVC

13 -3- 2009 ASP.NET MVC 1.0

10 -3- 2010 ASP.NET MVC 2

6 -10- 2010 ASP.NET MVC 3

20 -9- 2011 ASP.NET MVC 4

17 -10- 2013 ASP.NET MVC 5

9
 NI DUNG
1 Gii thiu MVC v ASP.NET MVC
2 Xy dng ng dng Web vi MVC5

3 Controller
4 View

5 Model

6 Validation

7 Website Organization
Xy dng ng dng Web
vi ASP.NET MVC 5
 c im ASP.NET MVC 5
MVC: Tch bit cc phn vic
trong x l yu cu.
St vi giao thc web: Khng
hng s kin nh ASP.NET
Khng duy tr thng tin trng
thi nh ASP.NET
T ng nhn din thit b: T D test: d dng test cc Action ca
la chn view ph hp.
Razor: sinh giao din.
Kiu d liu ng: ViewBag,
DataView
Ci thin Ajax: Jquery+ Helper Ajax.
Kim li: lp trnh1 ln p dng cho
c 2 client v server.
Web API: th vin web dng chn
nhiu loi thit b
Action Filter: kim sot cc Action.
cc Controller
NuGet: qun l cc gi m rng.
c tch hp trong Visual Studio
2013 v chy trn .NET 4.5, 4.5.1
12
 To Project
ASP.NET MVC 5
 To project ASP.NET MVC 5
M Visual Studio 2013 ->File ->New ->Project ->Templates ->Web ->Chn
ASP.NET Web Application

14
 Cc loi project ASP.NET MVC 5
Individual User Accounts: D n Internet bao gm c phn security
No Authentication: D n Internet khng bao gm phn security
Windows Authentication: D n Intranet bao gm c phn security
nhng ti khon c qun l trn mng ni b
Organizational Accounts: D n s dng ti khon t cloud
computing
Ngoi ra: bn c th chn Web API b sung kh nng h tr xy
dng th vin web

15
Cu trc project ASP.NET MVC 5

16
 Cc th mc project ASP.NET MVC 5
Controllers:
Cha tt c cc Controller trong ng dng.
p ng yu cu n t trnh duyt, quyt nh phi lm g v
phn hi kt qu.
Models: Cc lp m hnh d liu c t chc nm gi v thao
tc d liu
Views: Cha cc mu giao din ngi dng ca ng dng

17
 Cc th mc project ASP.NET MVC 5

App_Data: Cha cc file c s d liu (nuc)

App_Start: Cha lp c chy mt ln khi ng dng bt u
Content: Cha ti nguyn tnh nh hnh nh, CSS
Scripts: Cha Java Script cn thit ca ng dng
Global.asax: Tptin s kin cha cc iu khin s kin nhm kim
sot vng i ca Request, Session, Application
Web.config: Tp tin xml cha thng tin cu hnh ca ng dng web

18
 Thm Controller
Cc controller cha trong trong th mc Controller
Tn ca controller phi c hu t Controller

19
Thm Action

20
 Thm View
Right Click action -> Add View

21
 nh tuyn
Phn tch chui URL xc nh phng thc/lp no s c gi
Mc nhin ASP.NET s dng nh dng kiu nh sau:
/[Controller]/[ActionName]/[Parameters]
C th thay i nh dng ny ti App_Start/RouteConfig.cs file

22
nh tuyn

23
Thm nh tuyn

24
 NI DUNG
1 Gii thiu MVC v ASP.NET MVC
2 Xy dng ng dng Web vi MVC5

3 Controller
4 View

5 Model

6 Validation

7 Website Organization
Controller
 Controller
Cc controller dng x l cc request gi n, qun l d liu c nhp
bi ngi dng, tng tc v thc thi logic ng dng hp l
Mi controller cha cc phng thc (gi l action) v k tha lp Controller
c xy dng sn
Nhim v lp Controller
Tim kim action thch hp v kim tra action c th gi c khng
Ly cc gi tr c gi ln t request lm tham s cho action
X l tt c cc li c th xy ra trong sut qu trnh thc thi action
Cung cp lp RazorViewEngine mc nh render cc view tr v
cho trnh duyt

27
 Action Ni dung
Tham s
Tip nhn tham s
Request

FormCollection

i s Action
Model

Action Result
Text, View, Action, Url, File, JavaScript, Json

28
 Action Tham s
Tham s truyn di dng query string hay form field
Query string

Form field

29
Action Tip nhn tham s

30
 Action Tip nhn tham s
S dng Request, dng 1 trong cc cch sau:
String value = Request [<parameter name>]
String value = Request.QueryString [<parameter name>]
String value = Request.Form [<parameter name>]
String value = Request.Params [<parameter name>]

31
 Action Tip nhn tham s
S dng FormCollection, ch nhn c cc trng ca form
Tng ng cch String value = Request.Form [<parameter name>]

32
 Action Tip nhn tham s
S dng i s ca action, ch nhn c cc tham s trng tn
V d

33
 Action Tip nhn tham s
S dng Model
To lp model cha cc thuc tnh cng tn vi tham s
Dng lp ny lm i s cho cc action nhn cc tham s trng
tn vi thuc tnh

34
Action Action Result

35
 Action Action Result
Tn Result M t Hm s dng
ContentResult Tr v chui Content()
FileContentResult/ Tr v ni dung file File()
FilePathResult/
FileStreamResult
JavaScriptResult Tr v ni dung JavaScript() JavaScript()
JSonResult Tr v d liu dng Json Json()
RedictResult Chuyn sang URL mi Redirect()

RedirectToRouteResult Chuyn sang 1 action hoc 1 RedirectToRoute()

action ca controller khc RedirectToAction()

ViewResult Chuyn sang View hin th View()

PartialViewResult Chuyn sang View hin th PartialView()

36
 Action Action Selector
Action Selectors: nh du cc action
[HttpPost] action s c gi khi request POST
[HttpGet] action s c gi khi request GET
[ActionName(name)] i tn action
[ChildActionOnly] khng cho gi trc tip, ch gi qua
@Html.Action()
Ngoi ra c [NonAction] - nh du phng thc trong controller
khng phi l action

37
 Action Action Filter
Thc hin cc nhim v xy ra ti cc thi im thc hin khc nhau
ca mt action
C th s dng lc mt action n l, cc action trong mt
Controller hay tt c cc action trong project
Mt s action filter
[Authorize] bt buc ng nhp mi gi c action
[AllowAnonymous] khng bt buc ng nhp
[ValidateAntiForgeryToken] chn request gi mo
[ValidateInput] cho php hay khng gi m html n action
Ngoi ra c th to custom action filter
38
 Data Sharing
Chia s d liu gia cc thnh phn
C th s dng cc cch sau:
ViewBag, ViewData
Model

Session

Application

Cookie

Global.asax

39
 Data Sharing ViewBag, ViewData
Dng chia s d liu t Controller sang View
S dng dng: ViewBag.Key ViewData[Key]

40
 Data Sharing Model
Chia s d liu dng model: s trnh by chi tit phn sau

41
 Data Sharing Session
Phin lm vic (session) c tnh t lc bt u truy cp website
cho n khi ng ca s trnh duyt hoc ht hn
D liu c lu vo session s c duy tr trong sut phin lm
vic
Truy xut session
Controller: Sesion
View: @Session
Class bt k:
HttpContext.Current.Session

42
 Data Sharing Session
Thao tc vi session
Method/Prope M t V d
rty
Add(Key,Value) Thm mi 1 i tng vo Session.Add(Now,DateTime.N
Session. ow)

[Key]=Value Thm mi hoc thay th 1 i Session[Cart]=new

tng. ShoppingCart()

Remove(Key) Xa i tng Session.Remove(Cart)

Clear() Xa sch cc i tng trong Session.Clear()
Session

Abandon() Hy Session Session.Abandon()

SessionID M ca phin lm vic Var id = Session.SessionID

43
 Data Sharing Application
Application c phm vi chia s trn
ton ng dng, tt c cc user c
th truy cp
Truy xut i tng Application
Controller:
HttpContext.Application
View:
@HttpContext.Current.Application
class bt k:
HttpContext.Current.Application
44
 Data Sharing Application
Thao tc vi Application:
Application.Add(name, value)
Application[name] = <value>
Application.Remove(name)

Application.Clear()

Application.Lock()

Application.UnLock()

45
 NI DUNG
1 Gii thiu MVC v ASP.NET MVC
2 Xy dng ng dng Web vi MVC5

3 Controller
4 View

5 Model

6 Validation

7 Website Organization
View
View

48
 HTML5, CSS3, JQuery, Bootstrap
S dng HTML5, CSS3, Jquery, Bootstrap gip hin th hiu qu,
hiu ng p, tng tc vi ngi dng tt hn, thn thin vi nhiu
loi thit b

49
 Razor ???
Razor l c php lp trnh n gin, hu ch, cho php to giao din
ng dng ASP.NET MVC nhanh chng, r rng v linh hot.
Razor s dng c php C# hay VB.NET kt hp vi html .

50
Razor C php

51
Razor C php

52
 Razor Helper ???
Razor helper l cc thnh phn sinh giao din web ph hp vi rng
buc d liu ca model duy tr thng tin trn cc thnh phn
H tr n gin ha vic vit giao din
c chia lm cc nhm:
Lin kt
Form

Sinh giao din t model

Kim li

53
 Razor Helper Lin kt
@Html.ActionLink() dng sinh lin kt hyperlink
@Html.ActionLink() c cc tham s
LinkText: nhn lin kt
ActionName: tn action
ControllerName: tn controller
RouteValues: tp gi tr truyn n action
HtmlAttributes: tp thuc tnh html ca th <a>

54
Razor Helper Form

55
Razor Helper Form

56
Razor Helper Form

57
Razor Helper nh dng

58
Razor Helper nh dng s

59
Razor Helper nh dng thi gian

60
 Razor Helper Sinh giao din ng
Da vo c im ca cc thuc tnh trong lp sinh giao din
Sinh giao din tng minh
Sinh giao din ngm nh
Hin th thng tin

61
 Razor Helper Sinh giao din ng
Sinh giao din tng minh: ch nh loi control i vi tng thuc tnh

62
 Razor Helper Sinh giao din ng
Sinh giao din ngm nh: t sinh control ph hp vi c im thuc tnh
ca model
Html.EditorFor(m=>m.Property) Sinh1 control cho1 thuctnh.
Html.EditorForModel() Sinh ton form field theo cc thuc tnh ca Model
Html.Editor(object) Sinh ton form field theo cc thuc tnh ca Object t
trong ViewBag

63
Razor Helper Sinh giao din ng

64
 Razor Helper Sinh giao din ng
Cc kiu control thng dng

65
 Razor Helper Sinh giao din ng
Hin th thng tin
@Html.DisplayNameFor(m=> m.Property) Hin th tn ca thuc tnh
Property
@Html.DisplayFor(m=>m.Property) Hin th gi tr cho thuc tnh
Property
@Html.DisplayForModel() Hin th gi tr ca tt c cc thuc tnh
@Html.Display("Mail") Hin th gi tr ca tt c cc thuc tnh ca i
tng trong ViewData hay ViewBag

66
 Razor Helper Custom helper
Ngoi cc helper nh sn, bn c th t to mt helper cho ring
mnh
S dng 1 trong cc cch sau:
Static Method
Extention Method
Razor @helper

67
 Razor Helper Custom helper
Static method

Result
Tht s rt
View

68
 Razor Helper Custom helper
Extention Helper
Lp c m rng

Quy c

Result
View

69
 Razor Helper Custom helper

Razor @helper

Result
View

Tht s rt n gin

@Truncate(input, 20)
70
 NI DUNG
1 Gii thiu MVC v ASP.NET MVC
2 Xy dng ng dng Web vi MVC5

3 Controller
4 View

5 Model

6 Validation

7 Website Organization
Model
 Model
Trong MVC, model l mt lp cha cc thuc tnh, dng chia
s d liu gia Controller v View
Trong mt s ng dng ASP.NET MVC c s dng Entity
Framework, model c th l entity nh x n table CSDL
Model c th cha cc annotation cho cc thuc tnh phc v
validate d liu View v Controller

73
 Model Chia s d liu
T Controller -> View
Controller: kt qu ca action return View(model) vi model
khai bo kiu ModelClass
View: khai bo s dng @model ModelClass, v s dng
i tng @Model nh l kt qu nhn c
@model: t kha khai bo s dng model class
@Model: i tng cha kt qu nhn c t Controller
T View -> Controller: dng model lm i s cho action, view
c th dng model sinh giao din ng

74
Model Chia s d liu

75
 Model entity
Model c th dng lm entity nh x n table CSDL trong mt s
ng dng c s dng Entity Framework
Tm hiu thm Entity Framework: Here

76
 Model data annotation
Model c thng c cc data annotation nh du thuc tnh
kim li phc v validate d liu

77
 NI DUNG
1 Gii thiu MVC v ASP.NET MVC
2 Xy dng ng dng Web vi MVC5

3 Controller
4 View

5 Model

6 Validation

7 Website Organization
Validation
 Validation ???
Validation (kim li) l mt tnh nng quan trng trong ASP.NET
MVC v c pht trin trong mt thi gian di
Kim li d liu hn ch c m c gi n server, d liu sai do
ngi dng nhp
Kim li d liu cn thc hin 2 pha client v server

80
 Validation Trong ASP.NET MVC
Vi ASP.NET MVC ch cn vit mt ln nhng c th kim li cho c 2 pha
client v server
Model: thm cc data annotation kim li cc thuc tnh
View:
Kim li pha client: @Script.Render(~/bundles/jquery)
B sung vo form @Html.AntiForgeryToken() trnh cc request gi to
Hin th li: @Html.ValidationMessageFor(Property)
@Html.ValidationSummary()
Controller:
Kim li pha server ModelState.IsValid(),
ModelState.AddModelError()
81
 NI DUNG
1 Gii thiu MVC v ASP.NET MVC
2 Xy dng ng dng Web vi MVC5

3 Controller
4 View

5 Model

6 Validation

7 Website Organization
Website Organization
 Website Organization
Layout
@RenderBody()

@RenderSection()

@ViewBag.Property

Bundles
PartialView
@Html.Action()

@Html.Partial()

I18N - Quc t ha

84
 Website Organization Layout
Layout ging nh mt template ca view

Layout View

85
 Website Organization Layout
Layout cha:
Mt v ch mt @RenderBody() gi ch cho ni dung trong
view
Khng hoc nhiu @RenderSection() gi ch cho cc phn
c nh du @Section trong view
Layout View

@RenderBody() Content

@RenderSection() @Section {}

@ViewBag.Key @ViewBag.Key

86
 Website Organization Layout
p dng layout:

87
 Website Organization Bundles
Bundles ng gi cc ti nguyn BundleConfig.cs

S dng

88
Website Organization PartialView
PartialView l mt fragment c th ti s dng, gim thiu s
vit li m
@Html.Action(): Nhng mt Action
Action ny return PartialView() loi b Layout
Action ny c th nh du [ChildActionOnly] khng cho
truy xut trc tip
@Html.Partial(): Nhng mt View khng bao gm layout

89
Website Organization PartialView

90
Website Organization PartialView

91
 Website Organization I18N
I18N vit tt ca Internationalization Quc t ha

92
 Website Organization I18N
T chc ti nguyn

93
 Website Organization I18N
S dng ti nguyn

94
 Ti liu tham kho

1. Getting Started with ASP.NET MVC 5

http://
www.asp.net/mvc/overview/getting-started/introd
uction/getting-started
2. Pro ASP.NET MVC 5
Download

95
96
Thank You For Listening !

LOGO
DEMO
LOGO