Criação de uma aplicação Web ASP.NET MVC5 usando Code First ASP.NET MVC é um framework para desenvolvimento de aplicações web que usa os padrões MVC (Model View Controller) e Convention over Configuration. O padrão MVC aplicado a aplicações web conduz a uma separação de responsabilidades. Esta separação explícita de responsabilidades adiciona uma pequena quantidade de complexidade extra ao projeto de uma aplicação, mas os benefícios compensam o esforço extra. Modelos: são classes que representam o domínio. Os objetos do domínio encapsulam os dados armazenados numa base de dados assim como o código usado para manipular esses dados e para aplicar lógica de negócio específica do domínio. Incluem a camada de acesso a dados (Data Access Layer DAL) podendo usar uma ferramenta como Entity Framework. Vistas: são templates para gerar dinamicamente HTML. Controladores: classes que respondem às interacções do utilizador, acedem ao Modelo e decidem que Vista usar. Em Asp.Net estas classes têm o sufixo Controller. O framework ASP-NET MVC usa convenções sobre configurações (Convention over Configuration), o que permite fazer assunções baseadas nos nomes dos diretórios. O uso de convenções reduz a quantidade de código que é necessário escrever, e também facilita a compreensão do projeto por outros desenvolvedores. Construção de uma aplicação ASP.NET MVC 5 usando Visual Studio 2015 File > New > Project > Visual C#, Web >.Net Framework 4.6, ASP.NET Web Application (.NET Framework) Name: MvcApplication1 ASP.NET 4.6 Templates: MVC contém o princípio de uma aplicação Web MVC, incluindo funções de gestão de contas. Authentication: Individual User Accounts É possível correr a aplicação logo após ser criada. 1. Controladores Os controladores respondem aos pedidos HTTP e retornam informação para o browser. Recebem os dados de entrada, muitas vezes efetuam mudanças no modelo e fornecem dados para a vista. São responsáveis pelo fluxo da aplicação.
Nos frameworks Web tradicionais um URL era mapeado num ficheiro do disco do servidor web. Por exemplo um pedido feito com o URL /Produtos.aspx ou /Produtos.php é processado pelos ficheiros Produtos.aspx ou Produtos.php. Em MVC o mecanismo de routing mapeia um URL num método de uma classe Controller. O mecanismo de routing decide que classe Controller instanciar, que método de ação invocar, e fornece os argumentos necessários a esse método. O método de ação do controlador decide que vista usar e a vista gera o HTML. Asp.Net MVC implementa a variante Front Controller do padrão MVC. 1. Models > Adicionar classe Models > botão direito do rato: Add > Class > Name: Livro.cs Add Colocar propriedades dentro da classe Livro, que representam um livro na base de dados. namespace MvcApplication1.Models public class Livro public int LivroId get; set; public string Titulo get; set; 2. Criar subclasse de DbContext Entity Framework (EF) cria automaticamente a base de dados. A API de acesso a dados que foi desenvolvida para o Code First baseia-se na classe DbContext. Para o EF coordenar as funcionalidades de gerir os acessos à base de dados, para um dado modelo de dados, temos de criar uma classe derivada da classe DbContext. Nesta classe especificámos que entidades estão incluídas no nosso modelo de dados. Também se podem configurar certos comportamentos do Entity Framework. Criar uma pasta DAL. Dentro desta pasta criar a classe BibliotecaDbContext derivada de DbContext, que representa o contexto da base de dados, e trata de retribuir (select), guardar (insert), atualizar (update), e apagar (delete) instâncias da classe Livro na base de dados. MvcApplication1 > botão direito do rato: Add > New Folder > DAL DAL > botão direito do rato: Add > Class > Name: BibliotecaDbContext.cs Add Acrescentar using System.Data.Entity; para referenciar DbContext e DbSet. Acrescentar using MvcApplication1.Models; para referenciar a classe Livro.
using System.Data.Entity; using WebApplication1.Models; namespace WebApplication1.DAL public class BibliotecaDbContext : DbContext public BibliotecaDbContext() : base("defaultconnection") public DbSet<Livro> Livros get; set; Este código cria uma propriedade para cada entity set. No EF, um entity set tipicamente corresponde a uma tabela da base de dados, e uma entidade corresponde a uma linha da tabela. Por omissão Entity Framework usa a defaultconnectionfactory definida na secção de configuração do Entity Framework no Web.config, que aponta para o mssqllocaldb ou para o.\sqlexpress. Para usar uma dada base de dados colocámos um construtor na subclasse de DbContext especificando a connectionstring ou o nome da connectionstring. Podemos passar a connectionstring ao construtor de DbContext: public BibliotecaDbContext() : base(@="data Source=...") Ou passar o nome da connectionstring colocada no Web.config da aplicação: public BibliotecaDbContext() : base("defaultconnection") Se não se passa qualquer argumento ao construtor de DbContext, Entity Framework procurará uma connectionstring com o nome da classe DbContext criada (BibliotecaDbContext), no Web.config da aplicação. Se o Entity Framework não encontra a connectionstring no ficheiro Web.config, assume que "BibliotecaDbContext" é o nome da base de dados no servidor local Sql Express ou numa instância LocalDb, dependendo da connection factory configurada. O ficheiro Web.config criado automaticamente para esta aplicação, tem definida uma Connection String ("DefaultConnection") para a gestão de utilizadores. Assim usando a mesma connectionstring evitámos criar uma segunda base de dados. 3. Build 4. Scaffolding para criar Controladores e Vistas Scaffolding é usado por muitas tecnologias de software para significar geração rápida de um esquema do software que depois se pode editar. O template que gera este esquema inicial do código é usado como um andaime (scaffold) a partir do qual se constrói um programa mais poderoso.
Controllers > botão direito do rato: Add > Controller > Scaffolding options: Model class: Data context class: Controller name: Add MVC 5 controller with views, using Entity Framework Livro (MvcApplication1.Models) BibliotecaDbContext (MvcApplication1.DAL) LivrosController 5. Executar a aplicação (Start without Debugging = Ctrl+F5) Na barra de endereços do browser acrescentar /Livros localhost:xxxx/livros A base de dados é criada pelo Entity Framework. Testar o CRUD (Create, Read, Update, Delete) da aplicação. 6. Inspecionar a base de dados criada automaticamente Mudar da janela Solution Explorer para a janela Server Explorer. Expandir a base de dados DefaultConnection (MvcApplication1) debaixo de Data Connections. Expandir Tables para ver a tabela que foi criada. Na tabela > Show Table Data 2. Vistas A primeira impressão que um utilizador tem de uma Aplicação Web depende da vista e toda a interação com a aplicação é realizada através de vistas. Os controladores e os modelos são muito importantes mas esse trabalho não é visível. A vista é responsável por construir a interface com o utilizador (UI). Recebe o modelo (a informação que o controlador necessita de mostrar) e a vista transforma esse modelo num formato próprio para ser apresentado ao utilizador. As vistas não são diretamente acessíveis pelo browser. Uma vista é sempre invocada pelo controlador que lhe fornece os dados. Convenções em Asp.Net MVC As aplicações Asp.Net MVC, por omissão, funcionam com base em convenções. Isto evita ter de especificar tudo o que pode ser inferido através de convenções.
MVC usa uma estrutura de nomes de diretórios baseados em convenções que permite determinar os templates das vistas referidos pelos controladores sem especificar a localização. O ficheiro com o template da vista referido num método de um controlador encontra-se no diretório \Views\<Nome_do_Controlador>\ e tem o nome igual ao método do qual é invocado. As convenções do MVC podem ser substituídas quando necessário. Este conceito é designado por convenções sobre configurações (convention over configuration). Este conceito foi introduzido pelo Ruby on Rails. Convenções: O nome de cada classe Controlador termina em Controller, e é colocada no diretório Controllers. Há um único diretório Views para todas as vistas da aplicação. As vistas que cada Controlador usa são colocadas num subdiretório de Views com o nome do Controlador (exceto o sufixo Controller). Todas as vistas partilhadas são colocadas no subdiretório de Views com o nome Shared. Especificação das Vistas O diretório Views contém um subdiretório por controlador, com o mesmo nome do controlador, mas sem o sufixo controller. Dentro de cada um destes subdiretórios existe um ficheiro view para cada método de ação, com o mesmo nome do método de ação. Este é o processo base de associação de vistas a métodos de ação. Exemplo1: Se o método de ação do controlador não especificar o nome da vista aplica-se a convenção para localizar o objeto ViewResult retornado pelo método View(): é retornada uma vista com o mesmo nome do método de ação dentro do diretório Views/Nome_do_Controlador. Para o método /Livros/Index a vista selecionada será /Views/Livros/Index.cshtml return View(); Exemplo2: Se pretendermos que o método de ação /Livros/Index retornasse uma vista diferente colocada no subdiretório Livros (por exemplo Teste.cshtml) temos de fornecer o nome da vista. return View("Teste");
Exemplo3: Se pretendermos que o método de ação /Livros/Index retornasse uma vista diferente colocada num subdiretório diferente de Livros (por exemplo Teste.cshtml em /Views/Home/) temos de fornecer o nome completo da vista usando sintaxe com ~. Nesta sintaxe com ~ também temos de fornecer a extensão porque não é usado o mecanismo interno de procura de vistas. return View("~/Views/Home/Teste.cshtml"); Vistas fortemente Tipadas Para passar um objeto modelo para a vista, podemos colocá-lo como argumento do método View(). Na vista este objeto é colocado na propriedade Model. Mas esta propriedade é do tipo dinâmico, isto é, o seu tipo de dados só é determinado em tempo de execução. Podemos usá-la deste modo mas também é possível atribuir-lhe o tipo de dados correto. Atribuindo o tipo correto beneficiamos do Intellisense do Visual Studio quando acedemos às propriedades do objeto, e também às verificações em tempo de compilação (compile-time checking). Para que lhe seja atribuído o tipo de dados correcto temos de indicar à vista o tipo de dados da propriedade Model com a seguinte declaração: @model MvcApplication1.Models.Livro View Models Muitas vezes uma vista tem necessidade de mostrar informação que não mapeia diretamente num objeto do modelo do domínio. Como na vista só podemos ter um objeto Model, uma possibilidade para mostrar informação extra que não faça parte do modelo da vista é enviá-la através do ViewBag. Embora seja uma solução flexível, os dados obtidos pela vista através do VIewBag não são fortemente tipados, pelo que o programador da vista não terá a vantagem do intellisense do Visual Studio. Assim, pode ser útil construir uma classe para agregar toda a informação necessária para fornecer à vista, designada por ViewModel, um modelo (classe) construído com o único objetivo de fornecer informação para a vista. Uma classe ViewModel serve para encapsular múltiplos dados representados por instâncias de outras classes num objeto para passar à Vista.
Não há nenhuma localização pré-definida para colocar os ViewModels. Normalmente cria-se um diretório ViewModels na raiz do projeto MVC. Nesse diretório colocam-se todos os ViewModels, um ficheiro para cada classe, com a designação do nome do Controlador seguida do nome do método de ação (ou Vista). Exemplo: MvcApplication1 > Add > New Folder: ViewModels ViewModels/LivrosIndexViewModel.cs public class LivrosIndexViewModel public List<Livro> Livros get; set; public List<Autor> Autores get; set; Layouts Podemos usar um layout para definir um template comum para o site ou parte do site. Este template conterá um ou mais placeholders. As outras vistas da aplicação fornecerão conteúdos para estes placeholders. Exemplo: Layout1.cshtml <!DOCTYPE html> <html> <head><title>@viewbag.title</title></head> <body> <header> <h1>@viewbag.title</h1> </header> <div id="main-content">@renderbody() <footer>@rendersection("footer", required: false)</footer> </body> </html> Index.cshtml @ Layout = "~/Views/Shared/Layout1.cshtml"; ViewBag.Title = "Index"; <p>conteudo principal</p> @section Footer Este é o footer @RenderBody() é um placeholder que marca o lugar onde as vistas que usam este layout colocarão o seu conteúdo principal.
@RenderSection( Footer ) é um placeholder que marca o lugar onde as vistas que usam este layout colocarão o conteúdo especificado na secção @section Footer. As vistas têm de fornecer conteúdo para todas as secções definidas no layout, a não ser que a secção seja definida como opcional: @RenderSection( Footer, required: false) ViewStart Cada vista pode especificar a sua página de layout usando a propriedade Layout. Mas para um grupo de vistas que usem o mesmo layout podemos colocar num directório um ficheiro com o nome _ViewStart.cshtml. Este código é executado antes do código de qualquer vista nesse directório ou subdirectórios. _ViewStart.cshtml: @ Layout = "~/Views/Shared/_Layout.cshtml"; 3. Método Edit de LivrosController e correspondente vista Edit Classe LivrosController, método Edit: // GET: Livros/Edit/5 public ActionResult Edit(int? id) if (id == null) return new HttpStatusCodeResult(HttpStatusCode.BadRequest); Livro livro = db.livros.find(id); if (livro == null) return HttpNotFound(); return View(livro); // POST: Livros/Edit/5 // To protect from overposting attacks, enable the properties you want to bind to [HttpPost] [ValidateAntiForgeryToken] public ActionResult Edit([Bind(Include = "LivroId, Titulo")] Livro livro) if (ModelState.IsValid) db.entry(livro).state = EntityState.Modified; db.savechanges(); return RedirectToAction("Index"); return View(livro);
O 2.º método Edit é precedido pelo atributo HttpPost, o que especifica que este método só é invocado por pedidos POST. O 1.º método Edit poderia ter o atributo HttpGet, mas não é necessário, porque é assumido por omissão. Este método HttpGet só é invocado por pedidos GET. Todos os métodos que criam, editam ou apagam dados devem ser invocados por POST. Modificar dados usando o método de envio GET cria riscos de segurança para além de violar as boas práticas http que especificam que os pedidos GET não devem mudar o estado da aplicação. Processamento do pedido GET Este método recebe o id do Livro a editar. Este parâmetro é opcional (int? id), para que caso não o receba, evite erro de execução. Se o método Find() encontra o livro, retorna o objeto livro para o template vista. Se não encontra, o método HttpNotFound() é invocado. Processamento do pedido POST O mecanismo Model Binder do framework ASP.NET recebe os valores do formulário enviados por POST, cria um objeto Livro, que é passado como parâmetro ao método de ação Edit. ModelState.IsValid verifica se todos os validadores tiveram sucesso. O objeto Livro já existe na base de dados mas sofreu modificações. O método Entry() retorna o objecto DBEntityEntry desta entidade, fornecendo acesso a informação sobre a entidade e à capacidade de alterar essa informação. O estado do objeto é mudado para modificado. SaveChanges() guarda na base de dados todas as modificações feitas no contexto, executando o comando SQL Update para as entidades com a flag Modified. Todas as colunas da correspondente linha da tabela da base de dados são atualizadas, incluindo as que o utilizador não modificou. Em seguida o controlo é redirigido para o método de ação Index(), que mostra uma listagem dos livros já com este livro atualizado. Se a validação não teve sucesso o objeto livro que contém os valores recebidos do formulário é retornado para o template vista Edit.cshtml. Template Edit.cshtml @model WebApplication1.Models.Livro @ ViewBag.Title = "Edit"; <h2>edit</h2> @using (Html.BeginForm()) @Html.AntiForgeryToken() <div class="form-horizontal"> <h4>livro</h4> <hr /> @Html.ValidationSummary(true, "", new @class = "text-danger" ) @Html.HiddenFor(model => model.livroid) <div class="form-group"> @Html.LabelFor(model => model.titulo, htmlattributes: new @class = "control-label col-md-2" ) <div class="col-md-10">
@Html.EditorFor(model => model.titulo, new htmlattributes = new @class = "form-control" ) @Html.ValidationMessageFor(model => model.titulo, "", new @class = "text-danger" ) <div class="form-group"> <div class="col-md-offset-2 col-md-10"> <input type="submit" value="save" class="btn btn-default" /> <div> @Html.ActionLink("Back to List", "Index") @section Scripts @Scripts.Render("~/bundles/jqueryval") 4. Adicionar à aplicação a classe Editora 1. Models > Adicionar classe Models > botão direito do rato: Add > Class > Name: Editora.cs Add namespace MvcApplication1.Models public class Editora public int EditoraId get; set; public string Nome get; set; Modificar a classe Livro public class Livro public int LivroId get; set; public string Titulo get; set; public virtual Editora Editora get; set;
2. Incluir a entidade Editora no contexto de ligação à base de dados public class BibliotecaDbContext : DbContext public BibliotecaDbContext() : base("defaultconnection") public DbSet<Livro> Livros get; set; public DbSet<Editora> Editoras get; set; 3. Build 4. Scaffolding para criar Controladores e Vistas para a entidade Editora e novamente para a entidade Livro 5. Executar a aplicação (Start without Debugging = Ctrl+F5) Na barra de endereços do browser acrescentar /Livros Erro na aplicação. localhost:xxxx/livros 6. Usar Migrações Code First Com Entity Framework Code First podemos escrever o modelo que a base de dados é gerada pelo Entity Framework. A funcionalidade Migrações permite migrar a base de dados ao longo do desenvolvimento, sempre que há alterações do modelo de dados. À medida que o código evolui, através do Package Manager podemos adicionar Migrações e atualizar a Base de Dados. A Configuração e os ficheiros de Migração são adicionados à solução do Visual Studio, pelo que todas as mudanças das migrações da base de dados ficam adicionadas ao código fonte. Quando corremos uma aplicação e obtemos erro informando: The model backing the 'MyClassContext' context has changed since the database was created. Consider using Code First Migrations to update the database ( http://go.microsoft.com/fwlink/?linkid=238269). Tools > Nuget Package Manager > Package Manager Console Para ativar as migrações: (enable-migrations -contexttypename MyClassContext) PM> enable-migrations -contexttypename BibliotecaDbContext Este comando adiciona ao projeto uma pasta Migrations contendo 1 ou 2 ficheiros: - Configuration.cs que permite configurar como as migrações se comportam para o nosso contexto. - Se Code First já criou a base de dados, também adiciona uma migração InitialCreate, com código que representa os objetos que já foram criados na base de dados. O nome do ficheiro inicia-se por um timestamp para permitir ordenação. Para criar uma nova migração baseada nas alterações efetuadas ao modelo desde que a última migração foi criada: (add-migration nomemigracao) PM> add-migration AdicionadaClasseEditora
Na pasta Migrations é criada uma nova migração com o nome iniciado por um timestamp. A classe definida neste ficheiro contém 2 métodos: - Up com as alterações a executar na base de dados para efetuar a migração. - Down com as alterações a executar na base de dados para desfazer a migração. Para efetuar a migração da base de dados podemos usar o código gerado automaticamente ou fazer modificações nesse código. Para aplicar a última migração criada à base de dados: PM> update-database 7. Executar a aplicação (Start without Debugging = Ctrl+F5) 8. Incluir a chave estrangeira na classe Livro
public class Livro public int LivroId get; set; public string Titulo get; set; public int EditoraId get; set; public virtual Editora Editora get; set; 9. Usar Migrações Code First PM> add-migration ChaveEstrangeiraEditoraId PM> update-database System.Data.SqlClient.SqlException: Cannot insert the value NULL into column 'EditoraId', table.livroes'; column does not allow nulls. UPDATE fails. Agora a propriedade EditoraId da classe Livro por ser do tipo int não pode ter valor nulo. Dá erro porque o objeto livro existente na base de dados tem a propriedade EditoraId nula. Migrar para uma versão específica (incluindo Downgrade) Para fazer o upgrade/downgrade da base de dados para o estado que estava após realizar uma migração específica, por exemplo migracao1: PM> update-database targetmigration: migracao1 Este commando executa os scripts UP ou Down para migrar para migracao1. Para desfazer até voltar a ter uma base de dados vazia executar o comando: PM> update-database targetmigration: $InitialDatabase Executar: PM> update-database targetmigration $InitialDatabase PM> update-database Todos os registos são apagados da base de dados. Update-database efetua a migração da base de dados até à última migração criada. 10. Scaffolding novamente para criar Controladores e Vistas para as entidades Editora e Livro 11. Executar a aplicação (Start without Debugging = Ctrl+F5) Criar Editoras. Criar Livros.
5. Método Create de LivrosController e correspondente vista Edit // GET: Livros/Create public ActionResult Create() ViewBag.EditoraId = new SelectList(db.Editoras, "EditoraId", "Nome"); return View(); // POST: Livros/Create // To protect from overposting attacks, please enable the specific properties you // want to bind to. [HttpPost] [ValidateAntiForgeryToken] public ActionResult Create( [Bind(Include = "LivroId,Titulo,EditoraId")] Livro livro) if (ModelState.IsValid) db.livros.add(livro); db.savechanges(); return RedirectToAction("Index");
ViewBag.EditoraId = new SelectList(db.Editoras, "EditoraId", "Nome", livro.editoraid); return View(livro); O primeiro método Create é um método HttpGet, só executado em pedidos GET, usado para invocar a página Web com o formulário para ser preenchido pelo utilizador para criar objetos Livro. O segundo é um método HttpPost, só executado em pedidos POST, que recebe um objeto Livro criado com os dados introduzidos no formulário, e valida esses dados. Se a validação tem sucesso, guarda o objeto na base de dados, caso contrário, volta a apresentar o formulário com os dados que o utilizador preencheu. Caso a validação não tenha sucesso, o objeto Livro passado à vista contém os dados preenchidos pelo utilizador. O objecto SelectList guarda os itens destinados a carregar um DropDownList. O objecto SelectList é colocado no ViewBag numa dada chave (EditoraId). ficheiro Create.cshtml @model WebApplication6.Models.Livro @ ViewBag.Title = "Create"; <h2>create</h2> @using (Html.BeginForm()) @Html.AntiForgeryToken() <div class="form-horizontal"> <h4>livro</h4> <hr /> @Html.ValidationSummary(true, "", new @class = "text-danger" ) <div class="form-group"> @Html.LabelFor(model => model.titulo, htmlattributes: new @class = "control-label col-md-2" ) <div class="col-md-10"> @Html.EditorFor(model => model.titulo, new htmlattributes = new @class = "form-control" ) @Html.ValidationMessageFor(model => model.titulo, "", new @class = "text-danger" ) <div class="form-group"> @Html.LabelFor(model => model.editoraid, "EditoraId", htmlattributes: new @class = "control-label col-md-2" ) <div class="col-md-10"> @Html.DropDownList("EditoraId", null, htmlattributes: new @class = "form-control" ) @Html.ValidationMessageFor(model => model.editoraid, "", new @class = "text-danger" )
<div class="form-group"> <div class="col-md-offset-2 col-md-10"> <input type="submit" value="create" class="btn btn-default" /> <div> @Html.ActionLink("Back to List", "Index") @section Scripts @Scripts.Render("~/bundles/jqueryval") O método Html.DropDownList mostra os itens guardados no SelectList, usando a chave do ViewBag. Neste caso o SelectList guarda todas as Editoras existentes na base de dados, no objeto ViewBag, usando a chave EditoraId. O método Html.DropDownList carrega a DropDownList com o objeto existente no ViewBag na chave especificada EditoraId, ou seja, carrega com as Editoras existentes na base de dados. Se quiséssemos criar um livro com uma editora nova, teríamos primeiro de criar a editora e só depois poderíamos criar o livro. A variável model usada no ficheiro Create.cshtml representa o objeto fortemente tipado que é passado à vista pelo controlador com as restrições estabelecidas no modelo. A declaração @model efetua o casting para o tipo de dados do objeto. Através do objeto é possível conhecer as suas propriedades. 6. Adicionar à aplicação a classe Autor 1. Models > Adicionar classe Models > botão direito do rato: Add > Class > Name: Autor.cs Add namespace MvcApplication1.Models public class Autor public int AutorId get; set; public string Nome get; set; public virtual ICollection<Livro> Livros get; set;
Modificar a classe Livro public class Livro public int LivroId get; set; public string Titulo get; set; public int EditoraId get; set; public virtual Editora Editora get; set; public virtual ICollection<Autor> Autores get; set; 2. Incluir a entidade Autor no contexto de ligação à base de dados public class BibliotecaDbContext : DbContext public BibliotecaDbContext() : base("defaultconnection") public DbSet<Livro> Livros get; set; public DbSet<Editora> Editoras get; set; public DbSet<Autor> Autores get; set; 3. Build 4. Scaffolding para criar Controladores e Vistas para as entidades Autor e novamente para a entidade Livro 5. Executar a aplicação (Start without Debugging = Ctrl+F5) Na barra de endereços do browser acrescentar /Livros Erro na aplicação. localhost:xxxx/livros 6. Usar Migrações Code First PM> add-migration AdicionadaClasseAutor PM> update-database 7. Executar a aplicação (Start without Debugging = Ctrl+F5) Criar Autores.
8. Criar interface para atribuir valores para a relação LivroAutores Vamos atribuir autores a livros na página Edit de Livro. Para atribuir ou editar os autores de um livro vamos mostrar todos os autores existentes na base de dados, um checkbox para cada autor. A vista não deve ter lógica de negócio, pelo que devemos passar à vista apenas a informação necessária para o funcionamento da interface gráfica. Vamos criar um
modelo cujo único objetivo é passar informação para a vista, uma classe ViewModel designada AutorLivro. Como pretendemos atribuir ou editar os autores de um determinado livro, esta classe AutorLivro deve conter a seguinte informação: id do autor, nome do autor e se o autor já está atribuído ao livro. Criar uma nova pasta ViewModels. Nessa pasta criar uma classe com o nome AutorLivro public class AutorLivro public int AutorId get; set; public string Nome get; set; public bool AutorDoLivro get; set; Na classe LivrosController modificar o método HttpGet Edit: Código inicial de Controllers/LivrosController.cs, método HttpGet Edit: // GET: Livros/Edit/5 public ActionResult Edit(int? id) if (id == null) return new HttpStatusCodeResult(HttpStatusCode.BadRequest); Livro livro = db.livros.find(id); if (livro == null) return HttpNotFound(); ViewBag.EditoraId = new SelectList( db.editoras, "EditoraId", "Nome", livro.editoraid); return View(livro); Código modificado de Controllers/LivrosController.cs, método HttpGet Edit: // GET: Livros/Edit/5 public ActionResult Edit(int? id) if (id == null) return new HttpStatusCodeResult(HttpStatusCode.BadRequest); // Find nao permite eager loading //Livro livro = db.livros.find(id); Livro livro = db.livros.include(l => l.autores).where(l => l.livroid == id).singleordefault(); preencherautoresdolivro(livro); if (livro == null) return HttpNotFound(); ViewBag.EditoraId = new SelectList( db.editoras, "EditoraId", "Nome", livro.editoraid); return View(livro); private void preencherautoresdolivro(livro livro) var autores = db.autores; var autoreslivro = new HashSet<int>(livro.Autores.Select(a => a.autorid)); var viewmodel = new List<AutorLivro>();
foreach(var autor in autores) viewmodel.add(new AutorLivro AutorId = autor.autorid, Nome = autor.nome, AutorDoLivro = autoreslivro.contains(autor.autorid) ); ViewBag.Autores = viewmodel; Neste código o carregamento de um livro da base de dados inclui o carregamento da sua propriedade de navegação Autores (eager loading). O método preencherautoresdolivro cria uma lista de objetos AutorLivro, um objeto AutorLivro para cada um dos autores existentes na base de dados. Cada objeto AutorLivro leva na propriedade boolean AutorDoLivro informação se atualmente é autor do livro. Esta lista de objetos AutorLivro é passada à vista em ViewBag.Autores. Modificar Views/Livros/Edit.cshtml: Código inicial de Views/Livros/Edit.cshtml: @model MvcApplication1.Models.Livro @ ViewBag.Title = "Edit"; <h2>edit</h2> @using (Html.BeginForm()) @Html.AntiForgeryToken() <div class="form-horizontal"> <h4>livro</h4> <hr /> @Html.ValidationSummary(true, "", new @class = "text-danger" ) @Html.HiddenFor(model => model.livroid) <div class="form-group"> @Html.LabelFor(model => model.titulo, htmlattributes: new @class = "control-label col-md-2" ) <div class="col-md-10"> @Html.EditorFor(model => model.titulo, new htmlattributes = new @class = "form-control" ) @Html.ValidationMessageFor(model => model.titulo, "", new @class = "text-danger" ) <div class="form-group"> @Html.LabelFor(model => model.editoraid, "EditoraId", htmlattributes: new @class = "control-label col-md-2" )
<div class="col-md-10"> @Html.DropDownList("EditoraId", null, htmlattributes: new @class = "form-control" ) @Html.ValidationMessageFor(model => model.editoraid, "", new @class = "text-danger" ) <div class="form-group"> <div class="col-md-offset-2 col-md-10"> <input type="submit" value="save" class="btn btn-default" /> <div> @Html.ActionLink("Back to List", "Index") @section Scripts @Scripts.Render("~/bundles/jqueryval") Código modificado de Views/Livros/Edit.cshtml: @model MvcApplication1.Models.Livro @ ViewBag.Title = "Edit"; <h2>edit</h2> @using (Html.BeginForm()) @Html.AntiForgeryToken() <div class="form-horizontal"> <h4>livro</h4> <hr /> @Html.ValidationSummary(true, "", new @class = "text-danger" ) @Html.HiddenFor(model => model.livroid) <div class="form-group"> @Html.LabelFor(model => model.titulo, htmlattributes: new @class = "control-label col-md-2" ) <div class="col-md-10"> @Html.EditorFor(model => model.titulo, new htmlattributes = new @class = "form-control" ) @Html.ValidationMessageFor(model => model.titulo, "", new @class = "text-danger" ) <div class="form-group"> @Html.LabelFor(model => model.editoraid, "EditoraId", htmlattributes: new @class = "control-label col-md-2" ) <div class="col-md-10"> @Html.DropDownList("EditoraId", null,
htmlattributes: new @class = "form-control" ) @Html.ValidationMessageFor(model => model.editoraid, "", new @class = "text-danger" ) <div class="form-group"> <div class="col-md-offset-2 col-md-10"> <table> <tr> @ int cnt = 0; List< WebApplication6.ViewModels.AutorLivro> autores = ViewBag.Autores; foreach (var autor in autores) if (cnt++ % 3 == 0) @:</tr><tr> @:<td> <input type="checkbox" name="selectedautores" value="@autor.autorid" @(Html.Raw(autor.AutorDoLivro? "checked=\"checked\"" : "")) /> @autor.autorid @: @autor.nome @:</td> @:</tr> </table> <div class="form-group"> <div class="col-md-offset-2 col-md-10"> <input type="submit" value="save" class="btn btn-default" /> <div> @Html.ActionLink("Back to List", "Index") @section Scripts @Scripts.Render("~/bundles/jqueryval") Este código cria uma tabela html com 3 colunas. Cada célula tem um checkbox com o número e nome do autor. Todas as checkboxes têm o mesmo nome (name= selectedautores ) para serem tratadas com um grupo e para o browser enviar no parâmetro selectedautores uma lista com os valores selecionados. Na classe LivrosController modificar o método HttpPost Edit, executado quando o utilizador clica no botão Save. Código inicial de Controllers/LivrosController.cs, método HttpPost Edit: // POST: Livros/Edit/5
// To protect from overposting attacks, please enable the specific properties you want to bind to, for // more details see http://go.microsoft.com/fwlink/?linkid=317598. [HttpPost] [ValidateAntiForgeryToken] public ActionResult Edit([Bind(Include = "LivroId,Titulo,EditoraId")] Livro livro) if (ModelState.IsValid) db.entry(livro).state = EntityState.Modified; db.savechanges(); return RedirectToAction("Index"); ViewBag.EditoraId = new SelectList( db.editoras, "EditoraId", "Nome", livro.editoraid); return View(livro); Código modificado de Controllers/LivrosController.cs, método HttpPost Edit: // POST: Livros/Edit/5 // To protect from overposting attacks, please enable the specific properties you want to bind to, for // more details see http://go.microsoft.com/fwlink/?linkid=317598. [HttpPost] [ValidateAntiForgeryToken] public ActionResult Edit([Bind(Include = "LivroId,Titulo,EditoraId")] Livro livro, string[] selectedautores) var logfile = new StreamWriter("C:/temp/log3.txt"); db.database.log = logfile.writeline; if (ModelState.IsValid) Livro livroparaatualizar = db.livros.find(livro.livroid); atualizarautoresdolivro(livroparaatualizar, selectedautores); db.entry(livroparaatualizar).state = EntityState.Modified; db.savechanges(); logfile.close(); return RedirectToAction("Index"); preencherautoresdolivro(livro); ViewBag.EditoraId = new SelectList( db.editoras, "EditoraId", "Nome", livro.editoraid); logfile.close(); return View(livro); private void atualizarautoresdolivro(livro livroparaatualizar, string[] selectedautores) if (selectedautores == null) livroparaatualizar.autores = new List<Autor>(); return; var selectedautoreshs = new HashSet<string>(selectedAutores); var autoreslivro = new HashSet<int>( livroparaatualizar.autores.select(a => a.autorid)); var autores = db.autores; foreach (var autor in autores) // Se este autor foi um dos selecionados e if (selectedautoreshs.contains(autor.autorid.tostring()))
// ainda não pertence à lista dos autores do livro if (!autoreslivro.contains(autor.autorid)) // é adicionado à lista dos autores do livro livroparaatualizar.autores.add(autor); else // Se este autor não foi um dos selecionados // e pertence à lista dos autores do livro if (autoreslivro.contains(autor.autorid)) // é removido da lista dos autores do livro livroparaatualizar.autores.remove(autor); No código inicial o objeto livro era criado pelo Model Binder com os valores dos parâmetros recebidos no servidor e o seu estado marcado como Modified (o que faz automaticamente o attach ao contexto) para que SaveChanges o atualizasse (update) na base de dados (SaveChanges executa um Update porque o objeto livro tem id, campo escondido no browser). Agora pretendemos atualizar as propriedades do livro incluindo os objetos constituintes da sua propriedade de navegação Autores. Esta propriedade Autores terá os mesmos objetos que já existiam na base de dados, eventualmente adicionando alguns e removendo outros. O método AtualizarAutoresDoLivro atualiza a propriedade Autores do livro de acordo com o array de strings selectedautores criado pelo Model Binder com os valores dos parâmetros recebidos no servidor ( o name de cada checkbox é selectedautores ). Para que na página Index também seja possível ver os autores de cada livro vamos adicionar uma nova coluna com essa informação. Código de Controllers/LivrosController.cs, método HttpGet Index: // GET: Livros public ActionResult Index() var livros = db.livros.include(l => l.editora); return View(livros.ToList()); Código inicial de Views/Livros/Index.cshtml: @model IEnumerable<MvcApplication1.Models.Livro> @ ViewBag.Title = "Index";
<h2>index</h2> <p> @Html.ActionLink("Create New", "Create") </p> <table class="table"> <tr> <th> @Html.DisplayNameFor(model => model.editora.nome) </th> <th> @Html.DisplayNameFor(model => model.titulo) </th> <th></th> </tr> @foreach (var item in Model) <tr> <td> @Html.DisplayFor(modelItem => item.editora.nome) </td> <td> @Html.DisplayFor(modelItem => item.titulo) </td> <td> @Html.ActionLink("Edit", "Edit", new id=item.livroid ) @Html.ActionLink("Details", "Details", new id=item.livroid ) @Html.ActionLink("Delete", "Delete", new id=item.livroid ) </td> </tr> </table> Código modificado de Views/Livros/Index.cshtml: @model IEnumerable<MvcApplication1.Models.Livro> @ ViewBag.Title = "Index"; <h2>index</h2> <p> @Html.ActionLink("Create New", "Create") </p> <table class="table"> <tr> <th> @Html.DisplayNameFor(model => model.editora.nome) </th> <th> @Html.DisplayNameFor(model => model.titulo) </th> <th>autores</th> <th></th> </tr>
@foreach (var item in Model) <tr> <td> @Html.DisplayFor(modelItem => item.editora.nome) </td> <td> @Html.DisplayFor(modelItem => item.titulo) </td> <td> @ foreach (var autor in item.autores) @autor.autorid @: @autor.nome <br /> </td> <td> @Html.ActionLink("Edit", "Edit", new id=item.livroid ) @Html.ActionLink("Details", "Details", new id=item.livroid ) @Html.ActionLink("Delete", "Delete", new id=item.livroid ) </td> </tr> </table>