Вы находитесь на странице: 1из 33

Centro Universitrio Luterano de Palmas

curso de sistemas de informao


linguagem de programao para web

curso de
ASP.NET MVC
O contedo deste curso baseado na documentao oficial da Microsoft sobre o ASP.NET MVC e no
site do projeto: http://asp.net/mvc.

contedo
Introduo
Tutorial
Iniciando
Criando o primeiro aplicativo
Adicionando um Controller
Trabalhando com Views
Pginas de layout
Modificando views
Passando dados do Controller para a View
Adicionando um Model
Adicionando classes Model
Criando uma string de conexo
Acessando dados do Model a partir de um Controller
Examinando o cdigo gerado
Modelos fortemente tipados e a palavra @model
Processando a requisio POST

Captulo 1

Introduo
Tutorial
Este tutorial apresenta o passo-a-passo para a criao de um software de gerenciamento de filmes.
O que voc vai aprender:

como criar um projeto ASP.NET MVC


como criar Controllers e Views
como criar um banco de dados utilizando o paradigma Code First do Entity Framework
como retornar e apresentar dados
como editar dados e habilitar validao de dados

Iniciando
Um aplicativo ASP.NET MVC diferente de um aplicativo ASP.NET convencional. No Visual Studio,
enquanto um aplicativo ASP.NET criado como um web site, um aplicativo ASP.NET MVC criado
como um projeto. Portanto, para iniciar, crie um novo projeto utilizando File > New Project.

Criando o primeiro aplicativo


Na janela New Project selecione o template ASP.NET MVC 3 Web Application e defina onde o
projeto ser salvo (o nome e a localizao do projeto ficam sua escolha).

Na janela New ASP.NET MVC 3 Project selecione o template Internet Application, marque Use
HTML5 Markup e deixe a engine Razor como padro. Desmarque Create a unit test project, se
estiver marcado.

Ao clicar OK o Visual Studio criar o projeto utilizando os templates escolhidos, assim voc j tem
um bom lugar para comear a trabalhar. Este projeto um simples Hello World!.

Neste momento j possvel executar o projeto e verificar como as coisas esto andando. H duas
formas bsicas de iniciar o projeto: em modo de debug (F5) e em modo normal (CTRL+F5);
ambas compilam o projeto, o executam e abrem a janela do browser padro com a primeira pgina
do projeto.

Atente para a URL do site, que tem o formato http://localhost:porta/. http://localhost indica
que o site est sendo acessado atravs do protocolo HTTP. localhost o nome do servidor. Isto
mesmo, voc j est utilizando a infraestrutura da internet: o Visual Studio possui um servidor
web integrado para desenvolvimento e testes. O servidor web precisa de uma localizao e, no
caso do Visual Studio, todo projeto web (ASP.NET ou ASP.NET MVC) utiliza o nome localhost (para
identificar a mquina local como origem do servidor web) e um nmero de porta. Utilizar vrias
portas permite que numa mesma mquina estejam vrios servidores web. Ao executar o projeto o
servidor web de testes escolhe um nmero aleatrio para a porta.

Importante
Durante as modificaes no projeto ocorrero vrios processos de compilao. Se houver uma
janela do browser aberta, voc no precisa fech-la para que a mais nova verso do software
(pgina web) seja carregada, basta pressionar F5.

Pronto. O projeto acabou de ser criado e voc j tem um web site :) O prximo passo modificar o
funcionamento do software e aprender mais sobre o funcionamento do ASP.NET MVC.

Adicionando um Controller
MVC significa Model-View-Controller. MVC um padro de desenvolvimento de aplicativos que so
bem arquitetados e fceis de manter. Aplicaes baseadas em MVC contm:

Controllers: classes que tratam requisies de entrada para o aplicativo, retornam dados
do modelo, e ento especificam templates da View que retornam uma resposta para o
cliente
Models: classes que representam o dado da aplicao e que usam lgica de validao para
reforar regras de negcio para os dados
Views: arquivos de template que sua aplicao usa para gerar, dinamicamente, resposta
HTML
Estes conceitos sero apresentados neste tutorial e os veremos mais em detalhes em outros
captulos. Vamos continuar criando um novo Controller. No Solution Explorer, clique com o boto
direito sobre a pasta Controllers e selecione Add > Controller.
[figura: adicionando-controller]
Chame seu controller de HelloWorldController, use como template Empty controller e clique
Add. Ser criado o arquivo HelloWorldController.cs, dentro da pasta Controllers.
Um controller uma classe (herda de Controller) que precisa ter sempre o termo Controller
como parte do nome. Ao criar um controller, o Visual Studio insere cdigo padro, mas vamos
remover o cdigo criado automaticamente para a classe HelloWorldController e substituir pelo
cdigo a seguir:

public class HelloWorldController : Controller


{
// GET: /HelloWorld/
public string Index()
{
return "Esta eh a acao <b>padrao</b>...";
}
// GET: /HelloWorld/Welcome/
public string Welcome()
{
return "Esta eh a mensagem de boas-vindas";
}
}

Para chamar o mtodo HelloWorldController.Index() basta acessar a URL http://


localhost:porta/HelloWorld. O mtodo Index() o mtodo padro para todo controller, mas
vamos ver como modificar isso.

Importante

O projeto precisa ser compilado sempre que for feita alguma modificao nos controllers. Algumas
modificaes no exigem recompilao, como modificao no cdigo das views.

Veja que o que o browser apresenta o resultado do mtodo Index(), que uma string. Se
tivssemos pedido para retornar um nmero int, o resultado tambm seria apresentado pelo
browser. Isto demonstra um modelo poderoso de gerar contedo de retorno para o cliente,
entretanto, como voc j deve ter percebido, retornar o contedo completo de uma pgina HTML
vai dar muito trabalho. Por isso mesmo que vamos utilizar outros recursos do ASP.NET MVC.
ASP.NET MVC invoca diferentes controllers e diferentes mtodos dependendo da URL que est
sendo solicitada. A lgica padro para o mapeamento de URLs usa o formato a seguir:
/Controller/Acao/Parametros
As trs partes da URL so, portanto:
1. Controller
2. Ao (mapeada para um mtodo da classe que representa o controller)
3. Parmetros (mapeados para parmetros do mtodo que representa a ao)
Na verdade, este modelo da URL simples, mas bastante funcional. No caso do nosso exemplo, a
URL http://localhost:porta/HelloWorld mapeada para o controller HelloWorldController.
As trs partes da URL so opcionais e aplicada a seguinte lgica padro:
1. se houver controller, ento o controller invocado, caso contrrio invocado o controller

HomeController
2. se houver ao, ento invocada a ao do controller, caso contrrio invocada a ao
Index
3. se houver parmetros, os mesmos so passados para a ao, caso contrrio a ao
executada sem parmetros
Desta forma, durante este texto vamos chamar de ao (ou action) os mtodos dos controllers. A
partir deste momento tambm no vamos mais utilizar a URL absoluta, a partir de http, apenas a
URL relativa, a partir de / (que representa a raiz do site/aplicativo).
Navegue at a URL /HelloWorld/Welcome. A ao HelloWorldController.Welcome()
executada e retorna uma string. Veja que ainda no usamos parmetros na URL.

Vamos modificar a ao Welcome() para que possamos passar parmetros para o controller. Por
exemplo, queremos usar uma URL como /HelloWorld/Welcome?nome=Jose&contador=4.
Modifique a ao Welcome() para que tenha dois parmetros, conforme o cdigo a seguir:

public string Welcome(string nome, int contador = 1)


{
string mensagem = string.Format("Ol, {0}! Contador : {1}", nome,
contador);
return HttpUtility.HtmlEncode(mensagem);
}

Agora navegue at /HelloWorld/Welcome?nome=Jose&contador=4 e voc dever ver uma

sada semelhante ao seguinte:

O cdigo utiliza o recurso de valor padro de parmetro do C# para indicar que o parmetro
quantidade possui o valor padro 1, e assumir este valor, caso nenhum valor seja passado para
este parmetro. Isso permite que, se for usada a URL /HelloWorld/Welcome?nome=Jose a ao
Welcome(string, int) consiga ser executada sem problemas.
Ao processar a URL o ASP.NET MVC trata os argumentos da Querystring (o que vem depois do
sinal ?) e associa a parmetros da ao a ser executada. O importante que o nome do argumento
da Querystring seja o mesmo do parmetro da ao.
At aqui usamos aes retornando strings que representam o contedo HTML da View, entretanto,
vamos ver na prxima seo que h tcnicas melhores e prticas, como utilizar os templates.

Trabalhando com Views


O formato que usamos antes, no qual uma ao retorna uma string, que representa o HTML da view,
suficiente para algumas [poucas] situaes, o mais adequado utilizar os chamados templates.
O ASP.NET MVC 3 introduziu o uso da engine Razor. Templates baseados em Razor possuem a
extenso .cshtml e fornecem uma maneira elegante de gerar sada HTML utilizando C#.
Vamos comear adicionando uma view para a ao Index() do HelloWorldController. Modifique o
cdigo desta ao para o cdigo a seguir e depois clique com o boto direito e escolha Add View...

public ActionResult Index()


{

return View();
}

A janela Add View aparece. Deixe os campos como esto, pois so o padro e clique Add.

criada a pasta Views\HelloWorld e tambm o arquivo \Views\HelloWorld\Index.cshtml,


como voc pode notar no Solution Explorer.

Execute o aplicativo e navegue at /HelloWorld.

A ao HelloWorldController.Index() retorna ActionResult e o cdigo do mtodo possui return


View(). Quando esta linha executada o ASP.NET MVC procura pela view (template) que tem
o nome da ao que est sendo executada. Como no informamos um parmetro para o mtodo
View(), o ASP.NET MVC entende que a view padro a que tem o nome da ao, ou seja, procura o
arquivo /Views/HelloWorld/Index.cshtml.
Uma pergunta agora pode ser: de onde veio todo esse cdigo HTML sendo que a view s possui um
pouquinho de cdigo? A resposta est no fato de que a view est usando uma master page (ou
pgina de layout) e veremos como trabalhar com isso na prxima seo.

Pginas de layout
Abra o arquivo /Views/Shared/_Layout.cshtml. Este arquivo chamado de pgina de layout
(ou a conhecida master page da programao ASP.NET tradicional) e contm o cdigo HTML que
utilizando em todas as views que usam esta pgina de layout. Pginas de layout permitem que
voc defina o HTML que conter o contedo das outras views. Perceba a utilizao da instruo
@RenderBody(). RenderBody um placeholder, uma marca, que indica a regio do HTML que
receber o contedo das views.

Modificando views
Abra o arquivo /Views/HelloWorld/Index.cshtml. H dois lugares para fazer mudana:
1. o texto que aparece na barra de ttulo do browser
2. o cabealho secundrio da pgina (<h2>)
Modifique a view para que tenha o contedo a seguir:

@{
ViewBag.Title = "Filmes";
}
<h2>Filmes</h2>
<p>Lista de filmes.</p>

O ttulo da pgina modificado atravs da alterao da propriedade Title do objeto ViewBag. Este
objeto utilizado como uma forma de intercmbio/transporte de dados entre o controller e a view,
e entre view e pgina de layout, mas vamos tratar disso em outro momento. Na pgina de layout,
perceba que o valor dessa propriedade apresentado, utilizando <title>@ViewBag.Title</
title>.

Passando dados do Controller para a View


Controllers so responsveis por fornecer dados ou objetos necessrios para a view, de forma que
o contedo da view possa ser gerado para o browser. Uma view nunca deveria ter lgica de negcio
ou interao direta com o banco de dados. Ao invs disso, deveria sempre trabalhar com os dados
fornecidos pelo controller. Manter esta separao de interesses ajuda a manter o cdigo limpo e
mais fcil de realizar manutenes.
Atualmente, a ao Welcome(string, int) do HelloWorldController recebe dois parmetros, e a
mensagem gerada na ao e apresentada para o browser. Ao invs disso, vamos utilizar templates
de views. O template da view ir gerar uma resposta dinmica, que significa que voc precisa passar
os dados apropriados do controller para a view. Para fazer isso, vamos usar o objeto ViewBag, que
um objeto dynamic e, portanto, no tem uma estrutura rgida e bem definida, mas pode ter novas
propriedades sempre que preciso.
Abra o HelloWorldController e altere o mtodo Welcome(string, int) para o seguinte:

public ActionResult Welcome(string nome, int contador = 1)


{
ViewBag.Nome = nome;
ViewBag.Contador = contador;
return View();
}

Crie uma view para a ao Welcome(string, int) com o contedo a seguir:

@{
ViewBag.Title = "Boas-vindas";
}
<h2>Bem-vindo!</h2>
<p>Ol, @ViewBag.Nome!</p>
<ul>
@for (int i = 0; i < ViewBag.Contador; i++)
{
if (i % 2 == 0) {
<li style=color:red>Seja bem-vindo!</li>
} else {
<li>Seja bem-vindo!</li>
}
}
</ul>

Navegue at a URL /HelloWorld/Welcome?nome=Jose&contador=4. Voc ver o resultado da


view no browser.

Seguindo o princpio da separao de interesses, a lgica da view deve ser apenas a que utilizada
para gerar a prpria view, ou seja, a interface do aplicativo. Vimos tambm que o objeto ViewBag
fornece uma maneira simples de passarmos dados entre controller e view, mas esta ainda no
a parte M (do MVC) que queremos trabalhar. Na prxima seo, vamos ver como trabalhar com
entidades em um banco de dados.

Adicionando um Model
Nesta seo vamos adicionar algumas classes para gerenciar filmes em um banco de dados. Estas
classes so a parte M (Model) de um aplicativo ASP.NET MVC.
Usaremos a tecnologia de acesso a dados do .NET Framework conhecida como Entity Framework
para criar as classes que representam o Model. O Entity Framework (tambm conhecido como
EF) suporta um paradigma de desenvolvimento chamado Code First. Code First permite que
voc crie objetos do Model escrevendo classes simples, que so conhecidas como classes POCO -de Plain-Old CLR Objects. Code First criar o banco de dados em tempo de execuo a partir das
suas classes, o que fornece um fluxo de de

senvolvimento bastante limpo e gil.

Adicionando classes Model


No Solution Explorer clique com o boto direito na pasta Models e adicione uma classe, chamandoa Filme. Adicione propriedades classe, de modo que o cdigo seja semelhante ao seguinte:

public class Filme


{
public int Id { get; set; }
public string Titulo { get; set;
public DateTime DataDeLancamento
public string Genero { get; set;
public decimal Preco { get; set;
}

}
{ get; set; }
}
}

Usaremos a classe Filme para representar filmes no banco de dados. Cada instncia (objeto) de
Filme corresponder a uma linha (registro) em uma tabela do banco de dados, e cada propriedade
da classe Filme mapeia para uma coluna na tabela.
No mesmo arquivo adicione a classe FilmeDbContext:

public class FilmeDbContext : DbContext


{
public DbSet<Filme> Filmes { get; set; }
}

A classe FilmeDbContext representa o contexto do banco de dados de filmes usado pelo Entity
Framework, que trata o retorno, o armazenamento e a atualizao de instncias da classe Filme
no banco de dados. FilmeDbContext herda de DbContext, classe-base fornecida pelo Entity
Framework. Para ser capaz de referenciar DbContext e DbSet preciso usar o namespace
System.Data.Entity.

Criando uma string de conexo


A classe FilmeDbContext trata a tarefa de conexo com o banco de dados e mapeia objetos para
registros do banco de dados. Uma pergunta que vem sua mente agora como especificar o
banco de dados que vai ser conectado? Faremos isso adicionando informaes da conexo no
arquivo web.config. Abra o arquivo /web.config e adicione a string de conexo ao elemento
<connectionStrings>:
<add name="FilmeDbContext"
connectionString="Data Source=.\SQLEXPRESS;Integrated Security=SSPI;Initial
Catalog=MvcMovie;User Id=sa;Password=sa;"
providerName="System.Data.SqlClient"/>

Isso tudo que precisamos para indicar o banco de dados onde sero armazenados os dados de
instncias de Filme. Na prxima seo veremos como trabalhar com o gerenciamento completo
(inserir, atualizar, listar, excluir) dos filmes.

Acessando dados do Model a partir de um Controller


Clique com o boto direito sobre a pasta Controllers e crie um novo controller chamado
FilmesController. Selecione as opes a seguir:
Nome do controller: FilmesController
Template: Controller with read/write actions and views, using Entity Framework
Model classe: Filme (MvcMovie.Models)
Data context class: FilmeDbContext (MvcMovie.Models)

Views: Razor (CSHTML)

O Visual Studio criar o seguinte:


arquivo /Controllers/FilmesController.cs
pasta /Views/Filmes
arquivos Create.cshtml, Delete.cshtml, Details.cshtml, Edit.cshtml e Index.cshtml na
pasta /Views/Filmes
Daqui a pouco vamos ver o cdigo gerado, mas, por enquanto, apenas execute o aplicativo e
navegue at /Filmes. Voc ver uma tela semelhante que ilustra a imagem a seguir:

Para cadastrar um novo filme clique em Create New. O browser navegar para /Filmes/Create.
Preencha o formulrio e clique Create.

O browser navega novamente para /Filmes e voc v a lista de filmes com o filme cadastrado.

Para editar, clique em Edit; para ver detalhes, em Details, e para excluir, em Delete. Perceba as
URLs utilizadas:
Editar: /Filmes/Edit/1
Detalhes: /Filmes/Details/1
Excluir: /Filmes/Delete/1
Perceba que agora as URLs esto utilizando o formato completo apresentado antes: controller/
action/parmetros.
Agora que voc j conseguiu comprovar que os dados esto, realmente, sendo salvos em uma fonte
de dados persistente como um banco de dados do SQL Server, ento j podemos examinar o cdigo
que o Visual Studio criou automaticamente.

Examinando o cdigo gerado


Abra o arquivo \Controllers\FilmesController.cs e examine o cdigo gerado. A primeira
considerao interessante a respeito do atributo db, do tipo FilmeDbContext:
private FilmeDbContext db = new FilmeDbContext();

Lembra que, ao criarmos a classe FilmeDbContext fizemos com que ela herdasse de DbContext?
DbContext uma classe que implementa dois padres de programao e acesso a dados
chamados Unity of Work e Repository. Estes padres permitem usar uma fonte de dados como

um repositrio e agrupar operaes de mudanas nos dados, que so enviadas para a fonte de
dados como unidades de trabalho semelhantes a transaes. Em outras palavras, esta classe usada
para consultar, editar e excluir filmes.

Modelos fortemente tipados e a palavra @model


A primeira action do controller FilmesController a Index(), que apresenta a lista de filmes:

public ViewResult Index()


{
return View(db.Filmes.ToList());
}

Anteriormente, vimos que a passagem de dados entre contoller e view poderia ser feita atravs do
objeto ViewBag. ASP.NET MVC tambm possui a habilidade de passar dados fortemente tipados ou
objetos para uma view. Esta abordagem fortemente tipada permite melhor checagem em tempo de
compilao e tambm utiliza melhor o recurso de IntelliSense do Visual Studio.
Na action Index(), perceba como o tipo de retorno utilizado ViewResult, que mais especializado
que ActionResult. Veja tambm, que, para passar os dados para a view Index.cshtml chamado o
mtodo View() passando como parmetro o resultado de db.Filmes.ToList().
A view Index.cshtml comea definindo qual vai ser o objeto usado na view:

@model IEnumerable<MvcMovie.Models.Filme>

A instruo @model define o tipo de objeto esperado pela view, neste caso
IEnumerable<MvcMovie.Models.Filme>. Esta instruo tambm indica que o objeto Model ser
deste tipo, o que permite utilizarmos uma instruo foreach para iterar pela coleo de filmes:

@foreach (var item in Model) {


<tr>
<td>@Html.DisplayFor(modelItem => item.Titulo)</td>
<td>@Html.DisplayFor(modelItem => item.DataDeLancamento)</td>
<td>@Html.DisplayFor(modelItem => item.Genero)</td>
<td>@Html.DisplayFor(modelItem => item.Preco)</td>
<td>
@Html.ActionLink("Edit", "Edit", new { id=item.Id }) |
@Html.ActionLink("Details", "Details", new { id=item.Id }) |
@Html.ActionLink("Delete", "Delete", new { id=item.Id })

</td>
</tr>
}

Os links para as aes de editar, ver detalhes e excluir so gerados atravs do mtodo
ActionLink(string, string, object) do html helper, representado pelo objeto Html. No browser
isso representa, por exemplo, a URL /Filmes/Edit/1, quando se est prestes a editar o filme com
Id = 1. O primeiro parmetro o texto do link que vai ser gerado; o segundo o nome da action a
ser invocada; o terceiro representa os valores passados como parmetro para a action. Isso junto
representa uma rota.

(!) Importante
Outra forma de passar parmetros para a action, que j vimos, atravs da querystring. Por
exemplo, a URL /Filmes/Edit/1 tratada da mesma forma que /Filmes/Edit?id=1.

A rota representa um conceito fundamental no ASP.NET MVC. Toda rota traduzida pelo
ASP.NET MVC em um conjunto composto por: controller, action e parmetros. O padro da URL
{controller}/{action}/{id}. Na verdade, outras rotas podem ser criadas, para URLs mais
elaboradas, mas este o formato de rota padro, e est definido no arquivo Global.asax.cs:

public static void RegisterRoutes(RouteCollection routes)


{
routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
routes.MapRoute(
"Default",
"{controller}/{action}/{id}",
new { controller = "Home", action = "Index", id = UrlParameter.Optional }
);
}

Vamos tratar mais sobre rotas e tambm ver como podemos criar nossas prprias rotas para
propsitos mais especficos. Por enquanto, basta a voc saber que o formato da URL e como ele
interpretado pelo ASP.NET MVC no mgica :)
Abra o controller Filmes e vamos analisar os dois mtodos Edit().

public ActionResult Edit(int id)


{

Filme filme = db.Filmes.Find(id);


return View(filme);
}

[HttpPost]
public ActionResult Edit(Filme filme)
{
if (ModelState.IsValid)
{
db.Entry(filme).State = EntityState.Modified;
db.SaveChanges();
return RedirectToAction("Index");
}
return View(filme);
}

Note que o mtodo Edit(Filme) est marcado com o atributo HttpPost. Este atributo especifica que
esta sobrecarga do mtodo Edit() s pode ser invocada por requisies POST. O que vimos antes
disso foi, na verdade, que o ASP.NET MVC atende, por padro, a requisies GET, e por isso no
necessrio usar o atributo HttpGet. Para diferenciarmos a forma de requisio de certas aes,
principalmente as que usam sobrecarga, vamos usar os atributos HttpGet e HttpPost.
O mtodo HttpGet Edit(id) usa o parmetro id para procurar um filme utilizando o mtodo Find()
da classe DbSet e retorna o filme selecionado para a view Edit. Quando o Visual Studio criou a view
Edit, ele examinou a classe Filme e criou cdigo para renderizar os elementos <label> e <input>
para cada propriedade da classe.

@model MvcMovie.Models.Filme
@{
ViewBag.Title = "Edit";
}
<h2>Edit</h2>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/
javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")"
type="text/javascript"></script>
@using (Html.BeginForm()) {
@Html.ValidationSummary(true)
<fieldset>
<legend>Filme</legend>
@Html.HiddenFor(model => model.Id)
<div class="editor-label">

@Html.LabelFor(model => model.Titulo)


</div>
<div class="editor-field">
@Html.EditorFor(model => model.Titulo)
@Html.ValidationMessageFor(model => model.Titulo)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.DataDeLancamento)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.DataDeLancamento)
@Html.ValidationMessageFor(model => model.DataDeLancamento)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Genero)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Genero)
@Html.ValidationMessageFor(model => model.Genero)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Preco)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Preco)
@Html.ValidationMessageFor(model => model.Preco)
</div>
<p>
<input type="submit" value="Save" />
</p>
</fieldset>
}
<div>
@Html.ActionLink("Back to List", "Index")
</div>

O cdigo gerado automaticamente usa vrios html helpers para gerar a marcao HTML:
Html.LableFor apresenta o nome da propriedade
Html.EditFor apresenta um elemento <input> para editar o valor da propriedade
Html.ValidationMessageFor apresenta mensagens de validao associadas com a
propriedade
Execute o aplicativo e navegue at a URL /Filmes. Edite um filme e veja o cdigo-fonte HTML, que
semelhante ao seguinte:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Edit</title>
<link href="/Content/Site.css" rel="stylesheet" type="text/css" />
<script src="/Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>
<script src="/Scripts/modernizr-1.7.min.js" type="text/javascript"></script>
</head>
<body>
...
<h2>Edit</h2>
<script src="/Scripts/jquery.validate.min.js" type="text/javascript"></script>
<script src="/Scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></
script>
<form action="/Filmes/Edit/2" method="post">
<legend>Filme</legend>

<fieldset>

<input data-val="true" data-val-number="The field Id must be a number." dataval-required="The Id field is required." id="Id" name="Id" type="hidden" value="2" />
<div class="editor-label">
<label for="Titulo">Titulo</label>
</div>
<div class="editor-field">
<input class="text-box single-line" id="Titulo" name="Titulo" type="text"
value="When Harry Met Sally" />
<span class="field-validation-valid" data-valmsg-for="Titulo" datavalmsg-replace="true"></span>
</div>
<div class="editor-label">
<label for="DataDeLancamento">DataDeLancamento</label>
</div>
<div class="editor-field">
<input class="text-box single-line" data-val="true" data-valrequired="The DataDeLancamento field is required." id="DataDeLancamento"
name="DataDeLancamento" type="text" value="01/01/1989 00:00:00" />
<span class="field-validation-valid" data-valmsg-for="DataDeLancamento"
data-valmsg-replace="true"></span>
</div>
<div class="editor-label">
<label for="Genero">Genero</label>
</div>
<div class="editor-field">
<input class="text-box single-line" id="Genero" name="Genero" type="text"
value="Comdia" />
<span class="field-validation-valid" data-valmsg-for="Genero" datavalmsg-replace="true"></span>
</div>

<div class="editor-label">
<label for="Preco">Preco</label>
</div>
<div class="editor-field">
<input class="text-box single-line" data-val="true" data-val-number="The
field Preco must be a number." data-val-required="The Preco field is required."
id="Preco" name="Preco" type="text" value="10,00" />
<span class="field-validation-valid" data-valmsg-for="Preco" data-valmsgreplace="true"></span>
</div>
<p>
<input type="submit" value="Save" />
</p>
</fieldset>
</form>
<div>
<a href="/Filmes">Back to List</a>
</div>
</section>
<footer>
</footer>
</div>
</body>
</html>

Processando a requisio POST


Vejamos com mais detalhes o mtodo HttpPost Edit(Filme):

[HttpPost]
public ActionResult Edit(Filme filme)
{
if (ModelState.IsValid)
{
db.Entry(filme).State = EntityState.Modified;
db.SaveChanges();
return RedirectToAction("Index");
}
return View(filme);
}

O ASP.NET MVC possui um mecanismo chamado model binder (algo como vinculador de
modelo) que recebe o valor postado pelo formulrio e cria um objeto Filme que passado
como o parmetro filme. A propriedade ModelState.IsValid checa se os dados enviados pelo
formulrio podem ser usados para modificar um objeto Filme, ou seja, se os dados so vlidos.
Se forem vlidos, o cdigo salva os dados do filme na coleo de filmes do objeto db, instncia

da classe FilmeDbContext; o cdigo ento salva o filme no banco de dados chamando o mtodo
SaveChanges deste mesmo objeto. Aps salvar os dados o cdigo redireciona o usurio para a ao
Index(), que apresenta a lista de filmes atualizada.
Se os valores postados no so vlidos, eles so apresentados novamente no formulrio. As
mensagens de erro de validao so apresentadas pelo Html.ValidationMessageFor.

Vamos analisar um trecho da pgina HTML gerada:

<div class="editor-label">
<label for="DataDeLancamento">DataDeLancamento</label>
</div>
<div class="editor-field">
<input class="text-box single-line" data-val="true" data-valrequired="The DataDeLancamento field is required." id="DataDeLancamento"
name="DataDeLancamento" type="text" value="01/01/1989 00:00:00" />
<span class="field-validation-valid" data-valmsg-for="DataDeLancamento"
data-valmsg-replace="true"></span>
</div>

Perceba que as mensagens de validao so embutidas no HTML atravs de atributos nos


elementos <input>. O responsvel por isso um plugin do jQuery para o ASP.NET MVC

chamado jQuery Validate. H dois detalhes importantes para tratarmos antes de prosseguirmos:
1. A mensagem de validao est em ingls
2. Valores numricos esto sendo tratados de forma incorreta
Para resolver isso precisamos trabalhar com um recurso de internacionalizao e globalizao, que
veremos mais para frente.

Вам также может понравиться