ASP.NET
04.MVC 모델(Model) 추가하기
Godffs
2014. 5. 9. 16:31
MVC에서 모델은 응용프로그램에서 가장 중요한 부분을 하고 있습니다.
모델을 추가합니다.
Models폴더에서 클레스 파일을 추가합니다.
추가한 클레스에서 코드를 작성합니다.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15 |
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
namespace MvcApplication2.Models
{
public class Godffs_Model
{
public string ID { get; set; }
public string NAME { get; set; }
public int AGE { get; set; }
public bool SEX { get; set; }
}
} |
링크를 통해서 새 페이지를 열고 새 페이지에서 모델을 사용하도록 하겠습니다.
링크를 디자인 페이지를 수정합니다
Index.cshtml |
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26 |
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<title>Index</title>
</head>
<body>
<div>
안녕하세요. 여기는 뷰 페이지 입니다.
<br />
@ViewBag.Hello
<br />
@*Html.ActionLink("보여질이름", "실행될 액션");*@
@Html.ActionLink("NewPage", "NewForm");
</div>
</body>
</html>
| |
다음 Controller.cs에서 코드를 추가합니다.
GodffsController.cs |
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38 |
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace MvcApplication2.Controllers
{
public class GodffsController : Controller
{
//
// GET: /Godffs/
//public ActionResult Index()
//{
// return View();
//}
//public string Index()
//{
// return "안녕하세요~";
//}
public ViewResult Index()
{
string str_Message = "여기는 동적으로 출력합니다.";
ViewBag.Hello = str_Message;
return View();
}
[HttpGet]
public ViewResult NewForm()
{
return View();
}
}
}
| |
다음 새로 추가한 메서드 NewFrom()안에 View에서 영역을 지정하고 마우스 오른쪽 클릭하여 뷰페이지를 추가합니다.
강력한 형식의 뷰 만들기를 체크 하시고 모델 클레스에서 추가한 모델로 선택을 합니다.
액션메서드에 대응하기 위해서 추가를 진행하였습니다.
이렇게 되면 뷰에서 HTML 페이지에서 모델 클레스에 있는 속성들을 불러와 사용이 가능하기 때문입니다.
추가한 뷰 페이지 상단에 보니깐 @model 하고 선언이 되어 있네요.
간단한 입력폼을 만들어 봅니다.
NewForm.cshtml |
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31 |
@model MvcApplication2.Models.Godffs_Model
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<title>NewForm</title>
</head>
<body>
<div>
@using (Html.BeginForm())
{
<p>ID : @Html.TextBoxFor(a => a.ID )</p>
<p>이름 : @Html.TextBoxFor(a => a.NAME)</p>
<p>나이 : @Html.TextBoxFor(a => a.AGE)</p>
<p>
성별 @Html.DropDownListFor(a => a.SEX, new[]{
new SelectListItem() {Text = "남자", Value="M", Selected = true },
new SelectListItem() {Text = "여자", Value="W"}
})
</p>
<input type="submit" value="확인" />
}
</div>
</body>
</html>
|
|
확인 버튼을 클릭 했을때 입력했던 내용들을 출력하도록 코드를 작성합니다.
먼저 버튼을 클릭 했을때 새로운 페이지에 내가 입력한 내용을 보여주고 싶어서
controller.cs 에서 코드를 수정하고...
GodffsController.cs |
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46 |
using MvcApplication2.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace MvcApplication2.Controllers
{
public class GodffsController : Controller
{
//
// GET: /Godffs/
//public ActionResult Index()
//{
// return View();
//}
//public string Index()
//{
// return "안녕하세요~";
//}
public ViewResult Index()
{
string str_Message = "여기는 동적으로 출력합니다.";
ViewBag.Hello = str_Message;
return View();
}
[HttpGet]
public ViewResult NewForm()
{
return View();
}
[HttpPost]
public ViewResult NewForm(Godffs_Model dataModel)
{
return View("dataViewPage", dataModel);
}
}
}
| |
Post방식으로 메서드를 만들었고...다음 dataViewPage라는 이름으로 뷰 페이지를 만들고...
모델에서 넘겨받은 데이터를 화면에 보여줘야 하니깐 코드를 작성하고...
dataViewPage.cshtml |
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22 |
@model MvcApplication2.Models.Godffs_Model
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<title>dataViewPage</title>
</head>
<body>
<div>
<p>@Model.ID</p>
<p>@Model.NAME</p>
<p>@Model.AGE</p>
<p>@Model.SEX</p>
</div>
</body>
</html>
| |
다했다! 결과 확인
입력을 하고 확인버튼 클릭
결과가 잘 나왔습니다. 근데...성별에 value를 'M'으로 했는데..False로 나옵니다.
아...제가 성별을 bool 타입으로 했네요...입력한 결과를 보여주는 페이지를 수정합니다.
dataViewPage.cshtml |
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31 |
@model MvcApplication2.Models.Godffs_Model
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<title>dataViewPage</title>
</head>
<body>
<div>
<p>@Model.ID</p>
<p>@Model.NAME</p>
<p>@Model.AGE</p>
@*<p>@Model.SEX</p>*@
<p>
@if (Model.SEX == true) {
@:남자에요.
}
else{
@:여자에요.
}
</p>
</div>
</body>
</html>
| |
다음 입력화면에서 성별부분을 수정합니다.
NewForm.cshtml |
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32 |
@model MvcApplication2.Models.Godffs_Model
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<title>NewForm</title>
</head>
<body>
<div>
@using (Html.BeginForm())
{
<p>ID : @Html.TextBoxFor(a => a.ID )</p>
<p>이름 : @Html.TextBoxFor(a => a.NAME)</p>
<p>나이 : @Html.TextBoxFor(a => a.AGE)</p>
<p>
성별 @Html.DropDownListFor(a => a.SEX, new[]{
new SelectListItem() {Text = "남자", Value=bool.TrueString, Selected = true },
new SelectListItem() {Text = "여자", Value=bool.FalseString}
})
</p>
<input type="submit" value="확인" />
}
</div>
</body>
</html>
| |
다시 확인하기
참 쉽죠~? 끝