13/10/2016
ASP.NETMVCCriandoumaaplicaobsicaCRUDcomdropdownlist
ASP .NET MVC Criando uma aplicao bsica CRUD com
dropdownlist (Iniciante) I
Neste artigo eu vou mostrar como criar uma aplicao ASP .NET MVC bsica que realiza o CRUD em uma
base de dados SQL Server usando o VS 2013 Express for Web e o Entity Framework 6.
Este artigo uma reviso dos conceitos bsicos envolvidos na criao de uma aplicao ASP .NET MVC 5 usando o Entity Framework
6.0 e o SQL Server 2008 R2.
um artigo para iniciantes mostra como usar as tecnologias mais atuais da Microsoft para acessar dados e criar uma aplicao
web dinmica : o Entity Framework e o ASP .NET MVC 5.
A linguagem usada pode ser tanto o Visual C# como o Visual Basic .NET. Neste artigo eu vou usar o VB .NET.
Voc ver que o processo de criao de uma aplicao web usando MVC relativamente simples usando essas ferramentas.
Vamos criar uma aplicao simples que gerencia os dados de Alunos, departamentos e assuntos e com ajuda do Scaffolding da ASP
.NET MVC e do Entity Framework veremos como fcil gerar as pginas, ou views, da aplicao e o cdigo dos controladores de
forma automtica.
Como o artigo dirigido a iniciantes eu vou descrever o processo passo a passo.
Ento, acompanheme...
Recursos usados:
Microsoft VIsual Studio 2013 Express for web
SQL Server 2008 Express
Conceitos bem bsicos
O que afinal MVC ?
Aarquitetura/padro MVC (Modelo Visualizao Controle)fornece uma maneira de dividir a funcionalidade envolvida na
manuteno e apresentao dos dados de uma aplicao. A arquiteturaMVCno nova e foi originalmente desenvolvida para
mapear as tarefas tradicionais de entrada , processamento e sada para o modelo de interao com o usurio. Usando o padro MVC
fica fcil mapear esses conceitos no domnio de aplicaes Web multicamadas.
Na arquiteturaMVComodelo(Model)representa os dados da aplicao e as regras do negcio que governam o acesso e a
modificao dos dados. O modelo mantm o estado persistente do negcio e fornece ao controlador a capacidade de acessar as
funcionalidades da aplicao encapsuladas pelo prprio modelo.
Um componente de visualizao(View)renderizao contedo de uma parte particular do modelo e encaminha para o controlador as
aes do usurio; acessa tambm os dados do modelo via controlador e define como esses dados devem ser apresentados.
Umcontrolador(Controller)define o comportamento da aplicao , ele que interpreta as aes do usurio e as mapeia para
chamadas do modelo. Em um cliente de aplicaes Web essas aes do usurio poderiam ser cliques de botes ou selees de
menus. As aes realizadas pelo modelo incluem ativar processos de negcio ou alterar o estado do modelo.
Resumindo:
1.Models Classes que representam os dados da aplicao e que usa a lgica de validao para impor as regras de negcio para
os dados;
2.Views Arquivos Templates que sua aplicao usa para gerar resposta HTML dinmica;
3.Controller Classes que tratam as requisies do navegador, retornam os dados e ento especificam templates views que
retornam a resposta ao navegador para apresentao do resultado;
Como o MVC funciona ?
http://www.macoratti.net/15/04/mvc_crudb1.htm
1/7
13/10/2016
ASP.NETMVCCriandoumaaplicaobsicaCRUDcomdropdownlist
1.A requisio chega pelo navegador
2.As regras de roteamento so aplicadas
3.O controlador recebe a requisio e consulta o Model
4.O Model consulta os dados
5.O resultado apresentado usando templates views
O processo de criao da aplicao MVC usando ASP .NET MVC 5
A figura abaixo mostra os passos que iremos seguir para criar a nossa aplicao usando a ASP .NET MVC 5 e o Entity Framework:
Criando o projeto no Visual Studio 2013 Express for web
Abra o VS 2013 Express for web e clique em New Project;
Selecione a linguagem Visual Basic ou Visual C# (eu vou usar a linguagem VB.NET) e o template ASP .NET Web Application;
Informe o nome Mvc_App_Crud ou outro de sua preferncia e clique no boto OK;
A seguir selecione o template Empty, marque o item MVC para criar as pastas e incluir as referncias bsicas ao projeto;
finalmente clique no boto OK:
http://www.macoratti.net/15/04/mvc_crudb1.htm
2/7
13/10/2016
ASP.NETMVCCriandoumaaplicaobsicaCRUDcomdropdownlist
Ao final teremos uma soluo criada com a seguinte estrutura exibida na janela Solution Explorer:
Notamos que o projeto j foi criado com uma estrutura contendo as seguintes pastas:
App_Start Contm os arquivos de inicializao da aplicao dentre eles o RouteConfig que define o roteamento padro usado
no projeto;
Controllers Contm os controladores usados no projeto;
Models Contm as classes com o modelo de dados usando no projeto padro;
Views Contm os arquivos gerados para exibio nas respectivas pastas relacionadas com o nome do controlador.Os arquivos
possuem a extenso .vbhtml e so arquivos Razors gerados para linguagem VB .NET.
Alm disso temos o leiaute e o estilo da pgina gerados com os recursos do Twitter BootStrap.
Podemos alterar alguns arquivos ajustandoos para a nossa necessidade. Eu vou alterar alguns dados dos arquivos _Layout.vbhtml,
/Home/Index.vbhtml ,/Home/Contact.vbhtml e /Home/About.vbhtml apenas para dar uma personalizada no texto do projeto.(isso
no necessrio para que a aplicao funcione apenas uma customizao que no obrigatria)
Definindo o Model Incluindo um Entity Data Model (EDM) no projeto
Agora vamos definir nosso modelo de dados e vamos fazer isso incluindo um Entity Data Model na pasta Models do projeto.
http://www.macoratti.net/15/04/mvc_crudb1.htm
3/7
13/10/2016
ASP.NETMVCCriandoumaaplicaobsicaCRUDcomdropdownlist
Vamos usar como exemplo um pequeno banco de dados chamado Escola criado no SQL Server via SQL Server Management Studio
contendo as tabelas : Aluno, Departamento, Assunto.
Abaixo vemos a estrutura de cada tabela:
Aluno
Departamento
Assunto
Os campos AlunoID, DepartamentoID e AssuntoID so chaves primrias do tipo Identity.
Nota:Vamos incluir alguns dados na tabela Departamento e Assunto apenas para testes em nossa aplicao visto que iremos criar
inicialmente o controlador para o Aluno e a na view para incluir um Aluno necessrio informar o departamento e o assunto.
O relacionamento entre as tabelas e visto no diagrama abaixo:
Para incluir um Entity Data Model clique com o boto direito sobre a pasta Models e a seguir em Add > New Item;
A seguir clique em Data e selecione ADO .NET Entity Data Model e informe o nome Escola e clique no boto Add;
A seguir selecione a opo : EF Designer from database pois vamos gerar o EDM a partir do banco de dados que j existe:
http://www.macoratti.net/15/04/mvc_crudb1.htm
4/7
13/10/2016
ASP.NETMVCCriandoumaaplicaobsicaCRUDcomdropdownlist
Selecione o servidor SQL Server e o banco de dados Escola e clique no boto OK;
Aceite os valores gerados pelo assistente a partir do banco de dados selecionado e clique no boto Next>;
http://www.macoratti.net/15/04/mvc_crudb1.htm
5/7
13/10/2016
ASP.NETMVCCriandoumaaplicaobsicaCRUDcomdropdownlist
Selecione as tabelas Aluno, Assunto e Departamento e aceite o nome gerado e clique no boto Finish;
Ser gerado o modelo de entidades conforme a figura a seguir:
Nota: Eu alterei o nome da propriedade Assunto para AssuntoInfo na entidade Assunto para evitar conflito de nome com o nome da
entidade.
Para concluir compile o projeto e verifique se no h erros.
Na segunda parte do artigo vamos criar o controlador para a entidade Aluno e gerar as views para podemos realizar as operaes
bsicas(CRUD) com alunos.
http://www.macoratti.net/15/04/mvc_crudb1.htm
6/7
13/10/2016
ASP.NETMVCCriandoumaaplicaobsicaCRUDcomdropdownlist
Faloulhes, pois, Jesus outra vez, dizendo: Eu sou a luz do mundo; quem me segue no andar em trevas, mas ter a luz da
vida.
Joo 8:12
Veja os Destaques e novidades do SUPER DVD Visual Basic (sempre atualizado) :
clique e confira !
Quer migrar para o VB .NET ?
Veja mais sistemas completos para a plataforma .NET no Super DVD .NET ,
confira...
Curso Bsico VB .NET Vdeo Aulas
Quer aprender C# ??
Chegou o Super DVD C# com exclusivo material de suporte e vdeo aulas com
curso bsico sobre C#.
Curso C# Basico Video Aulas
Quer aprender os conceitos da Programao Orientada a objetos ?
Curso Fundamentos da Programao Orientada a Objetos com VB .NET
Quer aprender o gerar relatrios com o ReportViewer no VS 2013 ?
Curso Gerando Relatrios com o ReportViewer no VS 2013 Vdeo
Aulas
Gostou ?
Compartilhe no Facebook
Compartilhe no Twitter
Referncias:
Seo VB .NET do Site Macoratti.net
Super DVD .NET A sua porta de entrada na plataforma .NET
Super DVD Vdeo Aulas Vdeo Aula sobre VB .NET, ASP .NET e C#
Seo C# do site Macoratti.net
Super DVD C#
Super DVD Visual Basic
Curso Bsico VB .NET Vdeo Aulas
Curso C# Bsico Vdeo Aulas
macoratti YouTube
Macoratti.net | Facebook
Jose C Macoratti (@macorati) | Twitter
Padres de Projeto O modelo MVC Macoratti.net
ASP .NET MVC Introduo Macoratti.net
ASP .NET MVC 4 Macoratti.net
Seo ASP .NET MVC Macoratti .NET
C# Validando dados com Data Annotations Macoratti.net
Entity Frameweork 4 Usando Data Annotations Macoratti ...
Introduo ao Entity Framework Macoratti.net
C# CRUD bsico com Entity Framework Macoratti.net
Entity Framework 5 Operaes CRUD Macoratti.net
JosCarlosMacoratti
http://www.macoratti.net/15/04/mvc_crudb1.htm
7/7