210656858 introduccion a asp mvc4
TRANSCRIPT
Introducción a ASP.NET MVC 4
Intro to ASP.NET MVC 4 Por Rick Anderson|15 De agosto de 2012
Este tutorial le enseñará los fundamentos de la creación de una aplicación ASP.NET MVC 4 Web utilizando
Microsoft Visual Studio Express 2012 o Visual Web Developer 2010 Express Service Pack 1. Visual Studio 2012 se
recomienda, no necesitarás instalar nada para completar el tutorial. Si está utilizando Visual Studio 2010, debe instalar los
componentes más abajo. Puede instalar todas ellas haciendo clic en los enlaces siguientes:
Requisitos visuales Studio Web Developer Express SP1
Instalador WPI para ASP.NET MVC 4
LocalDB
SSDT
Si está utilizando Visual Studio 2010 en lugar de Visual Web Developer 2010, instale el instalador WPI para ASP.NET MVC
4 y el: requisitos previos de Visual Studio 2010
Un proyecto de Visual Web Developer con código fuente C# está disponible para acompañar a este tema.Descargar la
versión de C#.
En el tutorial de ejecutar la aplicación en Visual Studio. También puedes la aplicación disponible en Internet mediante la
implementación de un proveedor de hosting. Microsoft ofrece alojamiento web gratis para hasta 10 sitios web en
una cuenta de prueba gratis de Windows Azure. Para obtener información sobre cómo implementar un proyecto web de
Visual Studio a un sitio Web de Windows Azure, consulte crear e implementar un sitio web ASP.NET y base de datos SQL
con Visual Studio. Este tutorial también muestra cómo utilizar la entidad marco código primera migraciones para
implementar su base de datos de SQL Server en la base de datos de SQL Azure del Windows (anteriormente SQL Azure).
Lo que construirás
A aplicar una sencilla aplicación de película-listado que apoya la creación, edición, búsqueda y listado de películas de una
base de datos. A continuación se muestran dos imágenes de la aplicación que construirás. Incluye una página que muestra
una lista de películas desde una base de datos:
La aplicación también le permite agregar, editar y eliminar películas, así como ver detalles sobre los individuales.Todos los
escenarios de entrada de datos incluyen la validación para garantizar que los datos almacenados en la base de datos
están correctos.
Getting Started
Inicie Visual Studio Express 2012 o Visual Web Developer 2010 Express. La mayoría de las capturas de pantalla en esta
serie de aplicación Visual Studio Express 2012, pero usted puede completar este tutorial con Visual Studio 2010/SP1, 2012
de Visual Studio, Visual Studio Express 2012 o Visual Web Developer 2010 Express. SeleccioneNuevo proyecto en la
página de Inicio .
Visual Studio es un IDE o entorno de desarrollo integrado. Al igual que utilizar Microsoft Word para escribir documentos,
utilizará un IDE para crear aplicaciones. En Visual Studio, hay una barra de herramientas en la parte superior que muestra
varias opciones disponibles para usted. También hay un menú que ofrece otra manera para realizar tareas en el IDE. (Por
ejemplo, en lugar de seleccionar el Nuevo proyecto de la página de Inicio , puede utilizar el menú y
seleccione archivo > Nuevo proyecto.)
Crear su primera aplicación
Puede crear aplicaciones usando Visual Basic o Visual C# como lenguaje de programación. Seleccione Visual C# a la
izquierda y seleccione La aplicación Web ASP.NET MVC 4. Nombre de su proyecto "MvcMovie" y haga clic enAceptar.
En el cuadro de diálogo Nuevo proyecto de ASP.NET MVC 4 , seleccione Aplicación de Internet. Deje
laafeitadora como el motor de vista predeterminado.
Haga clic en Aceptar. Visual Studio utiliza una plantilla predeterminada para el proyecto de ASP.NET MVC que acaba de
crear, para que tenga una aplicación de trabajo ahora mismo sin hacer nada! Se trata de un simple proyecto "¡ Hola
mundo!", y es un buen lugar para comenzar su aplicación.
Desde el menú depurar , seleccione Iniciar depuración.
Observe que el método abreviado de teclado para empezar a depurar es F5.
F5 hace que Visual Studio Inicie IIS Express y ejecutar la aplicación web. Visual Studio entonces lanza un navegador y abre
la Página principal de la aplicación. Tenga en cuenta que la barra de direcciones del navegador dicelocalhost y no algo
como example.com. Eso es porque localhost apunta siempre a su propio equipo local, que en este caso se ejecuta la
aplicación que usted sólo construido. Cuando se ejecuta un proyecto web en Visual Studio, un puerto aleatorio se utiliza
para el servidor web. En la imagen siguiente, el número de puerto es 41788.Cuando se ejecuta la aplicación,
probablemente veremos un número de puerto distinto.
Sacarlo de la caja esta plantilla predeterminada le da inicio, contactos y sobre las páginas. También presta apoyo para
registrarse y acceder y enlaces a Facebook y Twitter. El siguiente paso es cambiar el funcionamiento de esta aplicación y
aprender un poco sobre ASP.NET MVC. Cerrar el navegador y vamos a cambiar algo de código.
Añadir un controlador
Adding a Controller Por Rick Anderson|28 De agosto de 2012
MVC está parado para model-view-controller. MVC es un patrón para el desarrollo de aplicaciones que son fáciles de
mantener, bien diseñada y comprobable. Aplicaciones basadas en MVC contienen:
Modelos: clases que representan los datos de la aplicación y que usar la lógica de validación para aplicar reglas de
negocio para los datos.
Vabía: archivos de plantilla que la aplicación utiliza para generar dinámicamente las respuestas HTML.
Controllers: clases que manejan las solicitudes entrantes de navegador, recuperar datos de modelo y especificar
plantillas de vista que devuelven una respuesta al navegador.
Nosotros ser cubriendo todos estos conceptos en esta serie de tutoriales y mostrarle cómo utilizarlos para crear una
aplicación.
Vamos a empezar por crear una clase de controlador. En Explorador de soluciones, haga clic derecho en
elcontroladores carpeta y a continuación, seleccione Agregar controlador.
Nombre de su nuevo controlador "HelloWorldController". Dejar la plantilla predeterminada como controlador MVC
vacío y haga clic en Agregar.
Aviso Explorador de soluciones que crea un nuevo archivo ha sido nombrado HelloWorldController.cs. El archivo
está abierto en el IDE.
Sustituir el contenido del archivo con el código siguiente.
using System.Web;
using System.Web.Mvc;
namespace MvcMovie.Controllers
{
public class HelloWorldController : Controller
{
//
// GET: /HelloWorld/
public string Index()
{
return "This is my <b>default</b> action...";
}
//
// GET: /HelloWorld/Welcome/
public string Welcome()
{
return "This is the Welcome action method...";
}
}
}
Los métodos del controlador devolverá una cadena de HTML como un ejemplo. El controlador se
denominaHelloWorldController y se llama el primer método anterior Index. Vamos a invocarlo desde un
navegador.Ejecute la aplicación (presione F5 o Ctrl + F5). En el navegador, anexar "HelloWorld" a la ruta en la barra de
direcciones. (Por ejemplo, en la figura de abajo, es http://localhost:1234/HelloWorld.) La página en el navegador se verá
como la siguiente pantalla. En el método anterior, el código devuelto una cadena directamente. Me dijiste que el sistema
sólo volver algunos HTML, y así fue!
ASP.NET MVC invoca otro regulador clases (y métodos de acción diferentes dentro de ellos) dependiendo de la URL de
entrada. La lógica de enrutamiento de enlace por defecto utilizada por ASP.NET MVC utiliza un formato como este para
determinar qué código para invocar:
/[Controller]/[ActionName]/[Parameters]
La primera parte de la URL determina la clase del controlador para ejecutar. Tan /HelloWorld asigna a
laHelloWorldController clase. La segunda parte de la URL determina el método de acción en la clase a
ejecutar.Tan /HelloWorld/Index causaría la Index método de la HelloWorldController clase a ejecutar. Tenga en cuenta
que sólo tuvimos que buscar a /HelloWorld y el Index método fue utilizado por defecto. Esto es porque un método
denominado Index es el método por defecto que se llamará en un controlador, si uno no se especifica explícitamente.
Vaya a http://localhost:xxxx/HelloWorld/Welcome. El Welcome método funciona y devuelve la cadena "Este es el método de
acción ¡ Bienvenido...". La asignación de MVC predeterminada es/[Controller]/[ActionName]/[Parameters]. Para
esta URL, es el controlador HelloWorld y Welcome es el método de acción. No has usado el [Parameters] parte de la
URL todavía.
Vamos a modificar un poco el ejemplo por lo que puede pasar alguna información del parámetro de la URL al controlador
(por ejemplo, /HelloWorld/bienvenida? nombre = Scott & numtimes = 4). Cambio su Welcome método para incluir dos
parámetros como se muestra a continuación. Observe que el código utiliza la característica de parámetro opcional de C#
para indicar que el numTimes parámetro debe por defecto a 1 si no se pasa ningún valor para ese parámetro.
public string Welcome(string name, int numTimes = 1) {
return HttpUtility.HtmlEncode("Hello " + name + ", NumTimes is: " + numTimes);
}
Ejecutar la aplicación y vaya a la URL de ejemplo
(http://localhost:xxxx/HelloWorld/Welcome?name=Scott&numtimes=4). Puedes probar diferentes valores
para name y numtimes en la URL. El sistema de fijación de ASP.NET MVC modelo asigna automáticamente los parámetros
con nombre de la cadena de consulta en la barra de direcciones para parámetros en su método.
En tanto estos ejemplos el controlador viene realizando la parte de "VC" de MVC — es decir, la obra vista y controlador. El
controlador está volviendo HTML directamente. Normalmente no quieren controladores volver HTML directamente,
puesto llega a ser muy incómodo al código. En cambio, normalmente usaremos un archivo de plantilla de vista separada
para ayudar a generar la respuesta HTML. Echemos un vistazo siguiente en cómo podemos hacer esto.
Agregar una vista
Adding a View Por Rick Anderson|28 De agosto de 2012
En esta sección vas a modificar la clase de HelloWorldController para utilizar archivos de plantilla de la vista para
encapsular limpiamente el proceso de generar respuestas HTML a un cliente.
A crear un archivo de plantilla de vista utilizando el motor de vistas de maquinilla de afeitar con ASP.NET MVC 3.Enfoque
basado en la maquinilla de afeitar las plantillas tienen un .cshtml extensión del archivo y proporcionar una manera
elegante de crear HTML de salida utilizando C#. Maquinilla de afeitar minimiza el número de caracteres y pulsaciones de
teclas necesarias al escribir una plantilla de vista y permite un fluido rápido, codificación de flujo de trabajo.
Actualmente el método de Index devuelve una cadena con un mensaje codificado en la clase del controlador.Cambiar el
método de Index para devolver un objeto View , como se muestra en el siguiente código:
public ActionResult Index()
{
return View();
}
El método de Index anterior utiliza una plantilla de vista para generar una respuesta HTML al navegador. Métodos de
controlador (también conocido como métodos de acción), como el método de Index anterior, generalmente devuelven
un ActionResult (o una clase derivada de ActionResult), los tipos primitivos no como cadena.
En el proyecto, agregue una plantilla de vista que se puede utilizar con el método de Index . Para ello, haga clic derecho
dentro del método de Index y haga clic en Agregar ver.
Aparece el cuadro de diálogo Agregar ver . Dejar los predeterminados de la manera que se haga clic en el
botónAgregar :
Se crean la carpeta MvcMovie\Views\HelloWorld y el archivo MvcMovie\Views\HelloWorld\Index.cshtml . Se los puede ver
en el Explorador de soluciones:
A continuación muestra el archivo Index.cshtml que se creó:
Agregue el siguiente código HTML en la etiqueta <h2> .
<p>Hello from our View Template!</p>
A continuación se muestra el archivo completo de MvcMovie\Views\HelloWorld\Index.cshtml .
@{
ViewBag.Title = "Index";
}
<h2>Index</h2>
<p>Hello from our View Template!</p>
Si está utilizando Visual Studio 2012, en el explorador de soluciones, haga clic con el botón derecho el
archivoIndex.cshtml y seleccione Mostrar en la página Inspector.
El Inspector página tutorial tiene más información acerca de esta nueva herramienta.
También puede ejecutar la aplicación y busque el controlador HelloWorld (http://localhost:xxxx/HelloWorld). El método
de Index en su controlador no mucho trabajo; simplemente funcionó la declaración return View(), que especifica que
el método debe utilizar un archivo de plantilla de vista para representar una respuesta al navegador. Porque no especificar
explícitamente el nombre del archivo de plantilla de vista utilizar, ASP.NET MVC por defecto utilizando el Index.cshtml Ver
archivo en la carpeta \Views\HelloWorld . La imagen de abajo muestra la cadena "Hola de nuestra plantilla de vista!" en la
vista.
Se ve bastante bien. Sin embargo, observe que barra de título del navegador muestra "Índice mi A ASP.NET" y el gran
enlace en la parte superior de la página dice "logo aquí." A continuación el enlace de "su logotipo aquí." registro y entrar
en enlaces y por debajo de la que se vincula a la casa, cerca y páginas de contacto. Vamos a cambiar algunas de ellas.
Cambiar puntos de vista y páginas de diseño
En primer lugar, usted quiere cambiar el título "tu logo aquí.", en la parte superior de la página. Ese texto es común a
todas las páginas. Realmente se implementa en un único lugar en el proyecto, a pesar de que aparece en cada página de
la aplicación. Vaya a la carpeta /Views/Shared en el Explorador de soluciones y abra el archivo_Layout.cshtml . Este
archivo se llama una página de diseño y es compartido "shell" que utilizan todas las demás páginas.
Las plantillas de diseño permiten especificar el diseño de envase HTML de su sitio en un solo lugar y luego aplicarlo a
través de varias páginas en su sitio. Busque la línea de @RenderBody() . RenderBody es un marcador de posición donde
todas las páginas de vista que creas demuestran para arriba, "envueltas" en la página de diseño.Por ejemplo, si selecciona
el enlace de sobre, el punto de vista Views\Home\About.cshtml se representa dentro del método RenderBody .
Cambie el encabezado del título de sitio en la plantilla de diseño de "tu logo aquí" a la película"MVC".
<div class="float-left">
<p class="site-title">@Html.ActionLink("MVC Movie", "Index", "Home")</p>
</div>
Reemplace el contenido del elemento title con el siguiente marcado:
<title>@ViewBag.Title - Movie App</title>
Ejecute la aplicación y observe que ahora dice "MVC Movie". Haga clic en el enlace de sobre y ver cómo esa página
muestra "la película MVC", también. Hemos sido capaces de hacer el cambio una vez en la plantilla de diseño y con todas
las páginas en el sitio reflejan el nuevo título.
Ahora, vamos a cambiar el título de la vista de índice.
Abrir MvcMovie\Views\HelloWorld\Index.cshtml. Hay dos lugares para hacer un cambio: en primer lugar, el texto que
aparece en el título del navegador y luego en el encabezado secundario (el elemento <h2> ). Te haces algo diferente para
que pueda ver que poco de código cambia que parte de la aplicación.
@{
ViewBag.Title = "Movie List";
}
<h2>My Movie List</h2>
<p>Hello from our View Template!</p>
Para indicar el título HTML para mostrar, el código anterior establece una propiedad Title del objeto ViewBag(que es en
la plantilla de vista de la Index.cshtml ). Si miras hacia atrás en el código de la plantilla de diseño, usted notará que la
plantilla utiliza este valor en el elemento de <title> como parte de la sección <head> del HTML que modificamos
anteriormente. Utilizando este enfoque ViewBag , fácilmente puede pasar otros parámetros entre la plantilla de la vista y
el archivo de diseño.
Ejecute la aplicación y vaya a http://localhost:xx/HelloWorld. Tenga en cuenta que han cambiado el título del navegador, el
título principal y los títulos secundarios. (Si no ve cambios en el navegador, usted puede estar viendo contenido
almacenado en caché. Presione CTRL+F5 en tu navegador para forzar la respuesta desde el servidor a cargarse). El título
del navegador se crea con la ViewBag.Title que hemos creado en la plantilla de vista de la Index.cshtml y el adicional "-
película App" en el archivo de diseño.
También se observa cómo el contenido de la plantilla de vista Index.cshtml se fusionó con la plantilla de
vista_Layout.cshtml y una sola respuesta HTML fue enviada al navegador. Plantillas de diseño hacen realmente fáciles de
realizar cambios que afecten a través de todas las páginas de la aplicación.
Nuestro poco de "datos" (en este caso el mensaje "Hola de nuestra plantilla de vista!") es modificable, sin embargo. La
aplicación MVC tiene una "V" (ver) y ya tienes una "C" (controlador), pero no "M" (modelo) todavía.Dentro de poco,
caminaremos a través de cómo crear una base de datos y recuperar datos de modelo de él.
Pasar datos del controlador a la vista
Antes de ir a una base de datos y hablar de modelos, sin embargo, primero hablemos pasando información del
controlador a la vista. Las clases del controlador se invocan en respuesta a una solicitud de enlace entrante. Una clase de
controlador es donde se escribe el código que controla el navegador entrante pide, recupera los datos de una base de
datos y en última instancia decide qué tipo de respuesta para enviar hacia el navegador. Plantillas de vista pueden
utilizarse luego de un controlador para generar y dar formato a una respuesta HTML al navegador.
Controladores son responsables de proporcionar cualquier información u objetos son necesaria para una plantilla de vista
representar una respuesta al navegador. Una mejor práctica: una plantilla de vista nunca debe realizar la lógica de
negocio o interactuar con una base de datos directamente. En cambio, una plantilla de vista debe trabajar sólo con los
datos que es proporcionados por el controlador. Mantener esta "separación de preocupaciones" ayuda a mantener el
código limpio, comprobables y más fácil de mantener.
Actualmente, el método de acción Welcome en la clase HelloWorldController tiene un name y un parámetro
denumTimes y entonces salidas los valores directamente en el navegador. En lugar de tener el controlador representar
esta respuesta como una cadena, vamos a cambiar el controlador para usar una plantilla de vista en su lugar. La plantilla
de vista generará una respuesta dinámica, por lo que usted tiene que pasar brocas adecuadas de datos del controlador a
la vista con el fin de generar la respuesta. Puede hacer esto al tener el controlador de poner los datos dinámicos
(parámetros) que la plantilla de vista en un objeto ViewBag que se puede acceder a la plantilla de la vista.
Volver al archivo HelloWorldController.cs y cambiar el método de Welcome para agregar un valor
de Message yNumTimes al objeto ViewBag . ViewBag es un objeto dinámico, que significa que usted puede poner lo que
quierasel objeto ViewBag no tiene ninguna propiedad definida hasta que ponga algo en su interior. El sistema de fijación
de ASP.NET MVC modelo asigna automáticamente los parámetros con nombre (name y numTimes) de la cadena de
consulta en la barra de direcciones a parámetros en su método. El archivo completo de HelloWorldController.cs se ve así:
using System.Web;
using System.Web.Mvc;
namespace MvcMovie.Controllers
{
public class HelloWorldController : Controller
{
public ActionResult Index()
{
return View();
}
public ActionResult Welcome(string name, int numTimes = 1)
{
ViewBag.Message = "Hello " + name;
ViewBag.NumTimes = numTimes;
return View();
}
}
}
Ahora el objeto ViewBag contiene datos que se pasarán automáticamente a la vista.
A continuación, necesita una plantilla de vista ¡ Bienvenido! En el menú generar , seleccione Crear MvcMovie para
asegurarse de que el proyecto se compila.
Luego haga clic derecho dentro del método Welcome y haga clic en Agregar ver.
Esto es lo que parece el cuadro de diálogo Agregar ver :
Haga clic en Agregary luego agregue el código siguiente debajo del elemento de <h2> en el nuevo
archivoWelcome.cshtml . A crear un bucle que dice "Hola" tantas veces como el usuario dice que debe. A continuación se
muestra el archivo completo de Welcome.cshtml .
@{
ViewBag.Title = "Welcome";
}
<h2>Welcome</h2>
<ul>
@for (int i=0; i < ViewBag.NumTimes; i++) {
<li>@ViewBag.Message</li>
}
</ul>
Ejecute la aplicación y vaya a la siguiente URL:
http://localhost:XX/HelloWorld/Welcome?name=Scott&numtimes=4
Ahora datos es tomadas de la URL y pasados al controlador usando la carpeta del modelo. El controlador paquetes los
datos en un objeto ViewBag y pasa ese objeto a la vista. La vista mostrará los datos como HTML al usuario.
En el ejemplo anterior, utilizamos un objeto ViewBag para pasar los datos del controlador a la vista. Este último en el
tutorial, usaremos un modelo de vista para pasar datos de un controlador a la vista. El enfoque del modelo de vista
pasando datos se prefiere generalmente mucho sobre el enfoque de la bolsa de vista. Ver la entrada de blogDinámico V
fuertemente escribió Views para obtener más información.
Bueno, era una especie de "M" para el modelo, pero no el tipo de base de datos. Vamos a hacer lo que has aprendido y
crear una base de datos de películas.
Agregar un modelo Por Rick Anderson|28 De agosto de 2012
En esta sección añadiremos algunas clases para gestionar películas en una base de datos. Estas clases será la parte de
"modelo" de la aplicación ASP.NET MVC.
Usted usará una tecnología de acceso a datos de .NET Framework conocida como el Entity Framework para definir y
trabajar con estas clases de modelo. Entity Framework (a menudo denominado EF) apoya un paradigma de desarrollo
llamado Primer código. Código primero permite crear objetos del modelo escribiendo clases simples.(Estos son también
conocidos como clases POCO, de "objetos CLR de llanura de edad.") Con ella podrás tener la base de datos creada sobre
la marcha de sus clases, que permite un flujo de trabajo de desarrollo muy limpio y rápido.
Agregar clases de modelo
En el Explorador de soluciones, haga clic derecho en la carpeta de modelos , seleccione Agregary seleccioneclase.
Introduzca el nombre de la clase "Película".
Agregue las siguientes cinco propiedades a la clase de Movie :
public class Movie
{
public int ID { get; set; }
public string Title { get; set; }
public DateTime ReleaseDate { get; set; }
public string Genre { get; set; }
public decimal Price { get; set; }
}
Vamos a usar la clase de Movie para representar películas en una base de datos. Cada instancia de un objeto
deMovie corresponderá a una fila de una tabla de base de datos, y cada propiedad de la clase de Movie se asigne a una
columna en la tabla.
En el mismo archivo, agregue la siguiente clase de MovieDBContext :
public class MovieDBContext : DbContext
{
public DbSet<Movie> Movies { get; set; }
}
La clase MovieDBContext representa el contexto de la base de datos de película de Entity Framework, que se encarga de
obtener, almacenar y actualizar instancias de la clase de Movie en una base de datos. ElMovieDBContext se deriva de la
clase base DbContext de Entity Framework.
Con el fin de ser capaces de referencia DbContext y DbSet, debe añadir la siguiente instrucción using al principio del
archivo:
using System.Data.Entity;
A continuación se muestra el archivo completo de Movie.cs . (Varios usando declaraciones que no sean necesarios han
sido removido.)
using System;
using System.Data.Entity;
namespace MvcMovie.Models
{
public class Movie
{
public int ID { get; set; }
public string Title { get; set; }
public DateTime ReleaseDate { get; set; }
public string Genre { get; set; }
public decimal Price { get; set; }
}
public class MovieDBContext : DbContext
{
public DbSet<Movie> Movies { get; set; }
}
}
Crear una cadena de conexión y trabajando con SQL Server
LocalDB
La clase MovieDBContext que creaste encarga de la tarea de conectar a la base de datos y mapeo de objetos de
la Movie a los registros de la base de datos. Una pregunta, que usted podría preguntarse, sin embargo, es cómo
especificar que se conectará a la base de datos. Harás agregando información de conexión en el archivoWeb.config de la
aplicación.
Abra el archivo Web.config de la aplicación raíz. (No el archivo Web.config en la carpeta Views .) Abra el
archivoWeb.config en rojo.
Añadir la siguiente cadena de conexión para el elemento <connectionStrings> en el archivo Web.config .
<add name="MovieDBContext"
connectionString="Data
Source=(LocalDB)\v11.0;AttachDbFilename=|DataDirectory|\Movies.mdf;Integrated Security=True"
providerName="System.Data.SqlClient"
/>
En el ejemplo siguiente se muestra una porción del archivo Web.config con la nueva cadena de conexión agregada:
<connectionStrings>
<add name="DefaultConnection"
connectionString="Data Source=(LocalDb)\v11.0;Initial Catalog=aspnet-MvcMovie-
2012213181139;Integrated Security=true"
providerName="System.Data.SqlClient"
/>
<add name="MovieDBContext"
connectionString="Data
Source=(LocalDB)\v11.0;AttachDbFilename=|DataDirectory|\Movies.mdf;Integrated Security=True"
providerName="System.Data.SqlClient"
/>
</connectionStrings>
Esta pequeña cantidad de código y XML es todo lo que necesita para escribir para representar y almacenar los datos de la
película en una base de datos.
A continuación, construirás una nueva clase de MoviesController que puede utilizar para mostrar los datos de la
película y permiten a los usuarios crear nueva cartelera.
Acceso a datos de su modelo desde un controlador Por Rick Anderson|28 De agosto de 2012
En esta sección, podrá crear una nueva clase de MoviesController y escribir código que recupera los datos de la película
y lo muestra en el navegador mediante una plantilla de vista.
Generar la aplicación antes de pasar al siguiente paso.
Haga clic derecho en la carpeta Controllers y crear un nuevo controlador de MoviesController . Las siguientes opciones
no aparecerán hasta que construyes tu aplicación. Seleccione las siguientes opciones:
Nombre del controlador: MoviesController. (Este es el valor por defecto).
Plantilla: Controlador MVC con acciones de lectura/escritura y vistas, con Entity Framework.
Modelo de clase: película (MvcMovie.Models).
Clase de contexto de datos: MovieDBContext (MvcMovie.Models).
Vistas: maquinilla de afeitar (CSHTML). (Predeterminado).
Haga clic en Agregar. Visual Studio Express crea los siguientes archivos y carpetas:
MoviesController.cs de un archivo en la carpeta de controladores .
Una carpeta " películas " en la carpeta del proyecto Views .
Create.cshtml, Delete.cshtml, Details.cshtml, Edit.cshtmly Index.cshtml en la carpeta Views\Movies .
ASP.NET MVC 4 crea automáticamente el CRUD (crear, leer, actualizar y eliminar) métodos de acción y vistas para usted (la
creación automática de vistas y métodos de acción CRUD es conocida como andamio). Ahora tienes una aplicación web
completamente funcional que permite crear, lista, editar y borrar las entradas de la película.
Ejecute la aplicación y busque el controlador de Movies añadiendo /Movies a la URL en la barra de direcciones del
navegador. Porque la aplicación se basa en el valor predeterminado enrutamiento (definida en el archivoGlobal.asax ), la
petición de navegador http://localhost:xxxxx/Movies se dirige al método de acción de Indexpredeterminado del
controlador de Movies . En otras palabras, la solicitud de navegadorhttp://localhost:xxxxx/Movies es que efectivamente
igual al navegador solicitar http://localhost:xxxxx/Movies/Index. El resultado es una lista vacía de películas, porque aún
alguno no ha añadido.
Crear una película
Seleccione el vínculo Crear nuevo . Entrar en algunos detalles acerca de una película y haga clic en el botón crear .
Haga clic en el botón crear causa la forma ser publicada en el servidor donde se guarda la información de la película en la
base de datos. Luego está redirigido a la URL /Movies , donde se puede ver la película recién creada en el listado.
Crear un par más entradas de cine. Trate de Editar, los datosy eliminar enlaces, que son todo funcional.
Examinar el código generado
Abra el archivo Controllers\MoviesController.cs y examinar el método de Index generado. A continuación se muestra una
porción del controlador de la película con el método de Index .
public class MoviesController : Controller
{
private MovieDBContext db = new MovieDBContext();
//
// GET: /Movies/
public ActionResult Index()
{
return View(db.Movies.ToList());
}
La siguiente línea de la clase MoviesController crea un contexto de base de datos de la película, como se ha descrito
anteriormente. Puede utilizar el contexto de la base de datos de la película para consultar, editar y borrar peliculas.
private MovieDBContext db = new MovieDBContext();
Una solicitud al controlador de Movies devuelve todas las entradas en la tabla de Movies de la base de datos de la
película y luego pasa los resultados a la vista de Index .
Modelos inflexible y la palabra clave de @model
Anteriormente en este tutorial, usted vio cómo un controlador puede pasar datos u objetos a una plantilla de vista
mediante el objeto ViewBag . El ViewBag es un objeto dinámico que proporciona una forma conveniente de enlazados
para pasar información a la vista.
ASP.NET MVC también ofrece la posibilidad de pasar fuertemente escribe datos u objetos a una plantilla de vista.Esto
inflexible de enfoque permite mejor tiempo de compilación de su código y más rico IntelliSense en el editor de Visual
Studio. El mecanismo de andamios en Visual Studio utiliza este enfoque con las plantillasMoviesController de la clase y
ver cuando se crean los métodos y las vistas.
En el archivo Controllers\MoviesController.cs examinar el método de Details generado. A continuación se muestra una
porción del controlador de la película con el método de Details .
public ActionResult Details(int id = 0)
{
Movie movie = db.Movies.Find(id);
if (movie == null)
{
return HttpNotFound();
}
return View(movie);
}
Si se encuentra una Movie , se pasa una instancia de la modelo de la Movie a la vista de detalles. Examinar el contenido
del archivo Views\Movies\Details.cshtml .
Mediante la inclusión de una declaración de @model en la parte superior del archivo de plantilla de vista, puede especificar
el tipo de objeto que espera de la vista. Al crear el controlador de la película, Visual Studio incluye automáticamente la
siguiente declaración de @model en la parte superior del archivo Details.cshtml :
@model MvcMovie.Models.Movie
Esta directiva de @model le permite acceder a la película que el controlador pasa a la vista mediante un Model de objeto
que es inflexible. Por ejemplo, en la plantilla de Details.cshtml , el código pasa cada campo de película a
losDisplayNameFor y ayudantes de DisplayFor HTML con el objeto de Model inflexible. Los métodos de crear y editar y
vista plantillas también pasan un objeto de modelo de la película.
Examinar la plantilla de vista de la Index.cshtml y el método de Index en el archivo MoviesController.cs . Observe cómo el
código crea un objeto List cuando llama al método de ayudante de View en el método de acción delIndex . El código
pasa esta lista de Movies del controlador a la vista:
public ActionResult Index()
{
return View(db.Movies.ToList());
}
Al crear el controlador de la película, Visual Studio Express incluye automáticamente la siguiente declaración de@model en
la parte superior del archivo Index.cshtml :
@model IEnumerable<MvcMovie.Models.Movie>
Esta directiva de @model permite acceder a la lista de películas que el controlador pasa a la vista mediante unModel de
objeto que es inflexible. Por ejemplo, en la plantilla de Index.cshtml , el código recorre las películas haciendo una
instrucción foreach sobre el objeto Model inflexible:
@foreach (var item in Model) {
<tr>
<td>
@Html.DisplayFor(modelItem => item.Title)
</td>
<td>
@Html.DisplayFor(modelItem => item.ReleaseDate)
</td>
<td>
@Html.DisplayFor(modelItem => item.Genre)
</td>
<td>
@Html.DisplayFor(modelItem => item.Price)
</td>
<th>
@Html.DisplayFor(modelItem => item.Rating)
</th>
<td>
@Html.ActionLink("Edit", "Edit", new { id=item.ID }) |
@Html.ActionLink("Details", "Details", { id=item.ID }) |
@Html.ActionLink("Delete", "Delete", { id=item.ID })
</td>
</tr>
}
Porque el objeto del Model es inflexible (como un objeto IEnumerable<Movie> ), cada objeto del item en el lazo se
escribe como Movie. Entre otros beneficios, esto significa que puedes Obtén comprobación en tiempo de compilación del
código y soporte de IntelliSense en el editor de código:
Trabajando con SQL Server LocalDB
Código de entidad marco primera detectó que la cadena de conexión de base de datos que proporcionaron señaló a una
base de datos de Movies que no existía todavía, primer código creado automáticamente la base de datos. Se puede
comprobar que se ha creado por mirar en la carpeta App_Data . Si no ves el archivo Movies.mdf , haga clic en el
botón Mostrar todos los archivos en la barra de herramientas del Explorador de soluciones , haga clic en el
botón Actualizar y continuación, expanda la carpeta App_Data .
Haga doble clic en Movies.mdf para abrir el Explorador de base de datos, a continuación, expanda la carpetatablas para
ver la tabla de películas.
Nota: Si no aparece el explorador de base de datos, en el menú Herramientas , seleccioneconectar a la base de datosy
cancelar el cuadro de diálogo Elegir origen de datos . Esto forzará abrir el explorador de base de datos.
Nota: Si usted está usando VWD o Visual Studio 2010 y sale un error similar a cualquiera de las siguientes opciones
siguientes:
La base de datos ' C:\Webs\MVC4\MVCMOVIE\MVCMOVIE\APP_DATA\MOVIES.MDF' no se puede abrir
porque es versión 706. Este servidor compatible con la versión anterior y 655. No se admite un camino de
descenso de categoría.
"Excepción InvalidOperation fue no controlada por el código de usuario" el SqlConnection suministrado no especifica
un catálogo inicial.
Es necesario instalar las Herramientas de datos de SQL Server y LocalDB. Verificar la cadena de
conexión MovieDBContext especificada en la página anterior.
Haga la tabla Movies y seleccione Mostrar datos de la tabla para ver los datos que creaste.
Haga la tabla Movies y seleccione Abrir definición de tabla para ver la estructura de la tabla que entidad marco código
primer creado para usted.
Observe cómo el esquema de los mapas de la tabla de Movies a la clase de Movie que creó anteriormente.Código de
entidad marco primera crea automáticamente este esquema para usted, basado en la clase de Movie .
Cuando haya terminado, cierre la conexión MovieDBContext de clic derecho y seleccionando Cerrar la conexión. (Si no
cierra la conexión, usted podría obtener un error la próxima vez que ejecute el proyecto).
Ahora tienes la base de datos y una página de listado simple para mostrar el contenido de ella. En el siguiente tutorial, a
examinar el resto del código escalonado y añadir un método de SearchIndex y una vista deSearchIndex que le permite
buscar películas en esta base de datos.
Examinar los métodos de editar y editar vista
Examining the Edit Methods and Edit View Por Rick Anderson|28 De agosto de 2012
En esta sección, podrá examinar los métodos de acción generados y vistas para el controlador de la película.Entonces
añades una página de búsqueda personalizada.
Ejecute la aplicación y busque el controlador de Movies añadiendo /Movies a la URL en la barra de direcciones del
navegador. Mantenga el puntero del ratón sobre un enlace Editar para ver la dirección URL que enlaza con.
El enlace Editar fue generado por el método de Html.ActionLink en la vista de Views\Movies\Index.cshtml :
@Html.ActionLink("Edit", "Edit", new { id=item.ID })
El objeto Html es un ayudante que se expone utilizando una propiedad en la clase
baseSystem.Web.Mvc.WebViewPage . El método ActionLink de la ayudante facilita generar dinámicamente
hipervínculos HTML que vinculan a los métodos de acción en los controladores. El primer argumento al
métodoActionLink es el enlace de texto para representar (por ejemplo, <a>Edit Me</a>). El segundo argumento es el
nombre de invocar el método de acción. El argumento final es un objeto Anónimo que genera los datos de la ruta (en este
caso, el ID de 4).
El vínculo generado que se muestra en la imagen anterior es http://localhost:xxxxx/Movies/Edit/4. La ruta por defecto
(establecida en App_Start\RouteConfig.cs) toma el patrón de URL {controller}/{action}/{id}. Por lo tanto, ASP.NET
se traduce a http://localhost:xxxxx/Movies/Edit/4 en una solicitud para el método de acción Edit del controlador
de Movies con el parámetro ID igual a 4. Examine el código siguiente en el archivoApp_Start\RouteConfig.cs .
public static void RegisterRoutes(RouteCollection routes)
{
routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
routes.MapRoute(
name: "Default",
url: "{controller}/{action}/{id}",
defaults: new { controller = "Home", action = "Index",
id = UrlParameter.Optional }
);
}
También puede pasar parámetros de método de acción utilizando una cadena de consulta. Por ejemplo, la
URLhttp://localhost:xxxxx/Movies/Edit?ID=4 también pasa el parámetro ID de 4 para el método de acción Edit del
controlador de Movies .
Abrir el controlador de Movies . Los dos métodos de acción Edit se muestran a continuación.
//
// GET: /Movies/Edit/5
public ActionResult Edit(int id = 0)
{
Movie movie = db.Movies.Find(id);
if (movie == null)
{
return HttpNotFound();
}
return View(movie);
}
//
// POST: /Movies/Edit/5
[HttpPost]
public ActionResult Edit(Movie movie)
{
if (ModelState.IsValid)
{
db.Entry(movie).State = EntityState.Modified;
db.SaveChanges();
return RedirectToAction("Index");
}
return View(movie);
}
Aviso el segundo método de acción Edit es precedido por el atributo HttpPost . Este atributo especifica que la
sobrecarga del método Edit puede ser invocado sólo para solicitudes POST. Se podría aplicar el atributo HttpGetpara el
primer método de edición, pero que no es necesario porque es el valor por defecto. (Nos referiremos a los métodos de
acción que implícitamente se asignaron el atributo HttpGet como HttpGet métodos).
El método de Edit HttpGet toma el parámetro ID de película, levanta la película usando el método de Entity
Framework Find y devuelve la película seleccionada a la vista de edición. El parámetro ID especifica un valor
predeterminado de cero si se llama al método Edit sin un parámetro. Si no se encuentra una película, se
devuelveHttpNotFound . Cuando el sistema de andamios crea la vista Edit, examinó la clase de Movie y crea código para
representar elementos <label> y <input> para cada propiedad de la clase. En el ejemplo siguiente se muestra la vista
Edit generado:
@model MvcMovie.Models.Movie
@{
ViewBag.Title = "Edit";
}
<h2>Edit</h2>
@using (Html.BeginForm()) {
@Html.ValidationSummary(true)
<fieldset>
<legend>Movie</legend>
@Html.HiddenFor(model => model.ID)
<div class="editor-label">
@Html.LabelFor(model => model.Title)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Title)
@Html.ValidationMessageFor(model => model.Title)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.ReleaseDate)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.ReleaseDate)
@Html.ValidationMessageFor(model => model.ReleaseDate)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Genre)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Genre)
@Html.ValidationMessageFor(model => model.Genre)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Price)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Price)
@Html.ValidationMessageFor(model => model.Price)
</div>
<p>
<input type="submit" value="Save" />
</p>
</fieldset>
}
<div>
@Html.ActionLink("Back to List", "Index")
</div>
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
}
Observe cómo la plantilla de vista tiene una declaración de @model MvcMovie.Models.Movie en la parte superior del
archivo, especifica que la vista espera que el modelo de la plantilla de vista de tipo Movie.
El código escalonado utiliza varios métodos auxiliares para optimizar el código HTML. El ayudante
deHtml.LabelFor muestra el nombre del campo ("Title", "ReleaseDate", "Género" o "Precio"). El ayudante
deHtml.EditorFor representa un elemento HTML <input> . El ayudante de Html.ValidationMessageFor muestra los
mensajes de validación asociados con esa propiedad.
Ejecute la aplicación y vaya a la URL /Movies . Haga clic en un enlace de Editar . En el navegador, ver el origen de la
página. A continuación se muestra el código HTML del elemento de formulario.
<form action="/Movies/Edit/4" method="post"> <fieldset>
<legend>Movie</legend>
<input data-val="true" data-val-number="The field ID must be a number." data-val-
required="The ID field is required." id="ID" name="ID" type="hidden" value="4" />
<div class="editor-label">
<label for="Title">Title</label>
</div>
<div class="editor-field">
<input class="text-box single-line" id="Title" name="Title" type="text" value="Rio
Bravo" />
<span class="field-validation-valid" data-valmsg-for="Title" data-valmsg-
replace="true"></span>
</div>
<div class="editor-label">
<label for="ReleaseDate">ReleaseDate</label>
</div>
<div class="editor-field">
<input class="text-box single-line" data-val="true" data-val-date="The field
ReleaseDate must be a date." data-val-required="The ReleaseDate field is required."
id="ReleaseDate" name="ReleaseDate" type="text" value="4/15/1959 12:00:00 AM" />
<span class="field-validation-valid" data-valmsg-for="ReleaseDate" data-valmsg-
replace="true"></span>
</div>
<div class="editor-label">
<label for="Genre">Genre</label>
</div>
<div class="editor-field">
<input class="text-box single-line" id="Genre" name="Genre" type="text"
value="Western" />
<span class="field-validation-valid" data-valmsg-for="Genre" data-valmsg-
replace="true"></span>
</div>
<div class="editor-label">
<label for="Price">Price</label>
</div>
<div class="editor-field">
<input class="text-box single-line" data-val="true" data-val-number="The field Price
must be a number." data-val-required="The Price field is required." id="Price" name="Price"
type="text" value="2.99" />
<span class="field-validation-valid" data-valmsg-for="Price" data-valmsg-
replace="true"></span>
</div>
<p>
<input type="submit" value="Save" />
</p>
</fieldset>
</form>
Los elementos <input> se encuentran en un elemento HTML de <form> cuyo atributo de action se establece a la
URL /Movies/Edit . Los datos del formulario se registrará en el servidor cuando se hace clic en el botón Editar .
Procesar la petición POST
El listado siguiente muestran la versión HttpPost del método de acción Edit .
[HttpPost]
public ActionResult Edit(Movie movie)
{
if (ModelState.IsValid)
{
db.Entry(movie).State = EntityState.Modified;
db.SaveChanges();
return RedirectToAction("Index");
}
return View(movie);
}
La carpeta del modelo ASP.NET MVC toma los valores de forma publicada y crea un objeto de Movie que se pasa como
parámetro del movie . El método ModelState.IsValid verifica que los datos presentados en forma pueden usarse para
modificar (edición o actualización) un objeto de Movie . Si los datos son válidos, los datos de la película se guardarán en la
colección de Movies de la db(MovieDBContext instance). Los nuevos datos de la película se guardan en la base de datos
llamando al método SaveChanges de MovieDBContext. Después de guardar los datos, el código redirige al usuario al
método de acción del Index de la clase MoviesController , que muestra la de colección de películas, incluyendo los
cambios que acaba de hacer.
Si los valores publicados no válidos, ellos se volverán a Mostrar en el formulario. Los ayudantes
deHtml.ValidationMessageFor en la plantilla de vista de Edit.cshtml cuidar de Mostrar mensajes de error apropiado.
Nota para apoyar la validación de jQuery para no-Inglés locales que usan una coma (",") para un punto decimal, debe
incluir la globalize.js y su archivo específico cultures/globalize.cultures.js(de https://github.com/jquery/globalize ) y
JavaScript para utilizar Globalize.parseFloat. El código siguiente muestra las modificaciones en el archivo
Views\Movies\Edit.cshtml para trabajar con la cultura "fr-FR":
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
<script src="~/Scripts/globalize.js"></script>
<script src="~/Scripts/globalize.culture.fr-FR.js"></script>
<script>
$.validator.methods.number = function (value, element) {
return this.optional(element) ||
!isNaN(Globalize.parseFloat(value));
}
$(document).ready(function () {
Globalize.culture('fr-FR');
});
</script>
<script>
jQuery.extend(jQuery.validator.methods, {
range: function (value, element, param) {
//Use the Globalization plugin to parse the value
var val = $.global.parseFloat(value);
return this.optional(element) || (
val >= param[0] && val <= param[1]);
}
});
</script>
}
El campo decimal puede requerir un campo común, no un punto decimal. Como una solución temporal, puede agregar el
elemento de la globalización para el archivo raíz web.config de proyectos. El código siguiente muestra el elemento de la
globalización con la cultura en Español de Estados Unidos.
<system.web>
<globalization culture ="en-US" />
<!--elements removed for clarity-->
</system.web>
Todos los métodos de HttpGet siguen un patrón similar. Obtener un objeto de película (o lista de objetos, en el caso
de Index) y pasar el modelo a la vista. El método Create pasa un objeto de película vacío a la vista de la creación. Todos
los métodos que crean, edición, borrar o modifican datos de hacen en la sobrecarga HttpPostdel método. Modificar
datos en un método HTTP GET es un riesgo de seguridad, como se describe en la entrada de blog post ASP.NET MVC Tip
#46 – no utiliza enlaces de eliminar porque crear agujeros de seguridad.Modificación de datos en un método GET también
viola las mejores prácticas HTTP y el patrón arquitectónico delresto , que especifica que las solicitudes GET no deben
cambiar el estado de su aplicación. En otras palabras, realizar una operación de obtención debe ser una operación segura
que no tiene efectos secundarios y no modifica sus datos persistentes.
Agregar un método de búsqueda y vista de búsqueda
En esta sección a añadir un método de acción de SearchIndex que le permite buscar películas por género o nombre. Esto
estará disponible usando la URL /Movies/SearchIndex . La solicitud mostrará un formulario HTML que contiene elementos
de entrada que un usuario puede escribir con el fin de buscar una película. Cuando un usuario envía el formulario, el
método de acción obtener los valores de búsqueda escritos por el usuario y utilizar los valores para buscar la base de
datos.
Mostrando la forma de SearchIndex
Comience agregando un método de acción SearchIndex a la clase de MoviesController existente. El método devuelve
una vista que contiene un formulario HTML. Aquí está el código:
public ActionResult SearchIndex(string searchString)
{
var movies = from m in db.Movies
select m;
if (!String.IsNullOrEmpty(searchString))
{
movies = movies.Where(s => s.Title.Contains(searchString));
}
return View(movies);
}
La primera línea del método SearchIndex crea la siguiente consulta LINQ para seleccionar las películas:
var movies = from m in db.Movies
select m;
La consulta se define en este momento, pero aún no ha sido dirigida contra el almacén de datos.
Si el parámetro searchString contiene una cadena, la consulta de películas se modifica para filtrar en el valor de la
cadena de búsqueda, utilice el siguiente código:
if (!String.IsNullOrEmpty(searchString))
{
movies = movies.Where(s => s.Title.Contains(searchString));
}
El s => s.Title código anterior es una Expresión Lambda. Lambdas se utilizan en las consultas LINQ basada en
métodos como argumentos a los métodos de operador de consulta estándar como donde el método utilizado en el
código anterior. Las consultas LINQ no se ejecutan cuando se definen o cuando son modificados por llamar a un método
como Where o OrderBy. En cambio, ejecución de la consulta es diferida, lo que significa que la evaluación de una
expresión se retrasa hasta que su valor realmente se itera sobre o se llama al método ToList . En la muestra
de SearchIndex , se ejecuta la consulta en la vista SearchIndex. Para obtener más información sobre la ejecución de la
consulta diferidos, ver la Ejecución de la consulta.
Ahora puede implementar la visión SearchIndex que mostrará el formulario para el usuario. Haga clic derecho dentro del
método SearchIndex y haga clic en Agregar ver. En el cuadro de diálogo Agregar ver especificar que vas a pasar un
objeto de Movie a la plantilla de ver como su clase modelo. En la lista de plantillas de andamio , elija de la listay, a
continuación, haga clic en Agregar.
Al hacer clic en el botón Agregar , se crea la plantilla de vista Views\Movies\SearchIndex.cshtml . Porque elegiste lalista en
la lista de plantilla del andamio , Visual Studio genera automáticamente (escalonada) algunos marcado por defecto en la
vista. El andamiaje había creado un formulario HTML. Examinó la clase de Movie y crea código para representar elementos
de <label> para cada propiedad de la clase. El listado a continuación muestra la visión de crear que se generó:
@model IEnumerable<MvcMovie.Models.Movie>
@{
ViewBag.Title = "SearchIndex";
}
<h2>SearchIndex</h2>
<p>
@Html.ActionLink("Create New", "Create")
</p>
<table>
<tr>
<th>
Title
</th>
<th>
ReleaseDate
</th>
<th>
Genre
</th>
<th>
Price
</th>
<th></th>
</tr>
@foreach (var item in Model) {
<tr>
<td>
@Html.DisplayFor(modelItem => item.Title)
</td>
<td>
@Html.DisplayFor(modelItem => item.ReleaseDate)
</td>
<td>
@Html.DisplayFor(modelItem => item.Genre)
</td>
<td>
@Html.DisplayFor(modelItem => item.Price)
</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>
}
</table>
Ejecute la aplicación y vaya a /Movies/SearchIndex. Añadir una cadena de consulta como ?searchString=ghost a la
URL. Se muestran las películas filtradas.
Si cambia la firma del método SearchIndex para tener un parámetro denominado id, el parámetro id coincidirá con el
marcador de posición de {id} para las rutas por defecto en el archivo Global.asax .
{controller}/{action}/{id}
El método de SearchIndex original se ve así::
public ActionResult SearchIndex(string searchString)
{
var movies = from m in db.Movies
select m;
if (!String.IsNullOrEmpty(searchString))
{
movies = movies.Where(s => s.Title.Contains(searchString));
}
return View(movies);
}
El método modificado de SearchIndex sería como sigue:
public ActionResult SearchIndex(string id)
{
string searchString = id;
var movies = from m in db.Movies
select m;
if (!String.IsNullOrEmpty(searchString))
{
movies = movies.Where(s => s.Title.Contains(searchString));
}
return View(movies);
}
Ahora puede pasar el título de búsqueda como datos de la ruta (un segmento de la URL) en vez de como un valor de
cadena de consulta.
Sin embargo, no pueden esperar los usuarios modificar la URL cada vez desean buscar una película. Ahora usted
añadiremos UI para ayudar a filtran películas. Si cambiaste la firma del método SearchIndex para probar cómo pasar el
parámetro ID de ruta-limite, cambiarlo para que el método SearchIndex toma un parámetro de cadena
denominado searchString:
public ActionResult SearchIndex(string searchString)
{
var movies = from m in db.Movies
select m;
if (!String.IsNullOrEmpty(searchString))
{
movies = movies.Where(s => s.Title.Contains(searchString));
}
return View(movies);
}
Abra el archivo Views\Movies\SearchIndex.cshtml y justo después de @Html.ActionLink("Create New", "Create"),
agregar lo siguiente:
@using (Html.BeginForm()){
<p> Title: @Html.TextBox("SearchString")<br />
<input type="submit" value="Filter" /></p>
}
En el ejemplo siguiente se muestra una porción del archivo Views\Movies\SearchIndex.cshtml con el marcado de filtrado
adicional.
@model IEnumerable<MvcMovie.Models.Movie>
@{
ViewBag.Title = "SearchIndex";
}
<h2>SearchIndex</h2>
<p>
@Html.ActionLink("Create New", "Create")
@using (Html.BeginForm()){
<p> Title: @Html.TextBox("SearchString") <br />
<input type="submit" value="Filter" /></p>
}
</p>
El ayudante de Html.BeginForm crea una abertura <form> etiqueta. El ayudante de Html.BeginForm causa la forma a sí
mismo cuando el usuario envía el formulario haciendo clic en el botón de filtro .
Ejecute la aplicación y trate de buscar una película.
No hay ninguna sobrecarga HttpPost del método SearchIndex . No es necesario, porque el método no es cambiar el
estado de la aplicación, sólo filtrado de datos.
Se podría agregar el siguiente método HttpPost SearchIndex . En ese caso, el invocador de acción coincidiría con el
método HttpPost SearchIndex , y el método HttpPost SearchIndex funcionaría como se muestra en la imagen de
abajo.
[HttpPost]
public string SearchIndex(FormCollection fc, string searchString)
{
return "<h3> From [HttpPost]SearchIndex: " + searchString + "</h3>";
}
Sin embargo, incluso si agrega esta versión HttpPost del método SearchIndex , existe una limitación en cómo esto
todos se implementó. Imagínese que usted quiere marcar una búsqueda particular o desea enviar un enlace a amigos que
puede hacer clic para ver la misma lista filtrada de películas. Tenga en cuenta que la dirección URL de la solicitud HTTP
POST es la misma que la URL de la solicitud GET (localhost:xxxxx/Peliculas/SearchIndex)--no hay ninguna información de
búsqueda en la URL de sí mismo. Derecho ahora, la información de la cadena de búsqueda se envía al servidor como el
valor de un campo de formulario. Esto significa que usted no puede capturar esa información de búsqueda para marcar o
enviar a amigos en una dirección URL.
La solución es utilizar una sobrecarga de BeginForm que especifica que la solicitud POST debe añadir la información de
búsqueda en la URL y se lo envía a la versión HttpGet del método SearchIndex . Reemplace el método sin parámetros
existente de la BeginForm con lo siguiente:
@using (Html.BeginForm("SearchIndex","Movies",FormMethod.Get))
Ahora cuando usted envía una búsqueda, la URL contiene una cadena de consulta de búsqueda. Busca también irá al
método de acción HttpGet SearchIndex , incluso si tienes un método HttpPost SearchIndex .
Añadir búsqueda por género
Si ha agregado la versión HttpPost del método SearchIndex , borrar ahora.
A continuación, añades una característica para permitir a los usuarios buscar películas por género. Reemplace el método
de SearchIndex con el siguiente código:
public ActionResult SearchIndex(string movieGenre, string searchString)
{
var GenreLst = new List<string>();
var GenreQry = from d in db.Movies
orderby d.Genre
select d.Genre;
GenreLst.AddRange(GenreQry.Distinct());
ViewBag.movieGenre = new SelectList(GenreLst);
var movies = from m in db.Movies
select m;
if (!String.IsNullOrEmpty(searchString))
{
movies = movies.Where(s => s.Title.Contains(searchString));
}
if (string.IsNullOrEmpty(movieGenre))
return View(movies);
else
{
return View(movies.Where(x => x.Genre == movieGenre));
}
}
Esta versión del método SearchIndex toma un parámetro adicional, es decir, movieGenre. Las primeras líneas de código
crean un objeto de la List que contenga los géneros del cine de la base de datos.
El código siguiente es una consulta LINQ que recupera todos los géneros de la base de datos.
var GenreQry = from d in db.Movies
orderby d.Genre
select d.Genre;
El código utiliza el método AddRange de la colección genérica de la List para agregar todos los géneros distintos a la
lista. (Sin el modificador Distinct , se agregarían duplicados géneros — por ejemplo, la comedia se agregarán dos veces
en nuestra muestra). El código entonces almacena la lista de géneros en el objeto ViewBag .
El código siguiente muestra cómo comprobar el parámetro movieGenre . Si no está vacío, el código más limita la consulta
de películas para limitar las películas seleccionadas para el género especificado.
if (string.IsNullOrEmpty(movieGenre))
return View(movies);
else
{
return View(movies.Where(x => x.Genre == movieGenre));
}
Agregar marcado a la vista de SearchIndex para apoyar la
búsqueda por género
Añadir un ayudante de Html.DropDownList en el archivo Views\Movies\SearchIndex.cshtml , justo antes de la ayudante
de TextBox . A continuación se muestra el marcado terminado:
<p>
@Html.ActionLink("Create New", "Create")
@using (Html.BeginForm("SearchIndex","Movies",FormMethod.Get)){
<p>Genre: @Html.DropDownList("movieGenre", "All")
Title: @Html.TextBox("SearchString")
<input type="submit" value="Filter" /></p>
}
</p>
Ejecute la aplicación y vaya a /Movies/SearchIndex. Intente una búsqueda por género, por el nombre de la película y por
ambos criterios.
En esta sección se examinan los métodos de acción CRUD y vistas generadas por el marco. Creó un método de acción de
búsqueda y vista que permiten a los usuarios buscar por título de la película y género. En la siguiente sección, veremos
cómo agregar una propiedad al modelo de la Movie y cómo agregar a un inicializador que creará automáticamente una
base de datos de prueba.
Agregar un nuevo campo a la modelo película y la Tabla
Adding a New Field to the Movie Model and Table Por Rick Anderson|28 De agosto de 2012
En esta sección deberá usar entidad marco código primera migraciones migrar algunos cambios a las clases de modelo
para que el cambio se aplica a la base de datos.
De forma predeterminada, cuando se utiliza código de entidad marco primera para crear automáticamente una base de
datos, como lo hizo anteriormente en este tutorial, primer código agrega una tabla a la base de datos para ayudar a
seguir el esquema de la base de datos sea en sincronía con las clases de modelo se generó desde.Si no están
sincronizados, Entity Framework produce un error. Esto facilita localizar temas en tiempo de desarrollo que podrían de lo
contrario sólo encuentras (por errores oscuros) en tiempo de ejecución.
Configuración de migraciones primer código para modelar los
cambios
Si está utilizando Visual Studio 2012, haga doble clic en el archivo Movies.mdf desde el explorador de soluciones para abrir
la herramienta de base de datos. Visual Studio Express para Web mostrará el explorador de base de datos, que Visual
Studio 2012 mostrará el explorador de servidores. Si está utilizando Visual Studio 2010, utilice el explorador de objeto de
servidor SQL.
La herramienta de base de datos (Database Explorer, explorador de servidores o explorador del objeto de servidor SQL),
haga clic en MovieDBContext y seleccione borrar a la base de datos de películas.
Navegar hacia el explorador de soluciones. Haga clic derecho sobre el archivo Movies.mdf y seleccione borrar para
eliminar la base de datos de películas.
Generar la aplicación para asegurarse de que no hay ningún error.
Desde el menú Herramientas , haga clic en Gestor de paquetes de biblioteca y luego la Consola del administrador de
paquetes.
En la ventana de la Consola de administrador de paquetes en el PM> el símbolo del sistema escriba "Enable-migraciones
- ContextTypeName MvcMovie.Models.MovieDBContext".
El comando Enable-migraciones (mostrado arriba) crea un archivo Configuration.cs en una nueva carpeta demigraciones .
Visual Studio abre el archivo Configuration.cs . Reemplace el método de la Seed en el archivo Configuration.cs con el
siguiente código:
protected override void Seed(MvcMovie.Models.MovieDBContext context)
{
context.Movies.AddOrUpdate( i => i.Title,
new Movie
{
Title = "When Harry Met Sally",
ReleaseDate = DateTime.Parse("1989-1-11"),
Genre = "Romantic Comedy",
Price = 7.99M
},
new Movie
{
Title = "Ghostbusters ",
ReleaseDate = DateTime.Parse("1984-3-13"),
Genre = "Comedy",
Price = 8.99M
},
new Movie
{
Title = "Ghostbusters 2",
ReleaseDate = DateTime.Parse("1986-2-23"),
Genre = "Comedy",
Price = 9.99M
},
new Movie
{
Title = "Rio Bravo",
ReleaseDate = DateTime.Parse("1959-4-15"),
Genre = "Western",
Price = 3.99M
}
);
}
Haga clic derecho sobre la línea serpenteante roja bajo la Movie y
seleccionar resolver luego, usandoMvcMovie.Models;
Hacerlo añade la siguiente instrucción using:
using MvcMovie.Models;
Migraciones primer código llama al método de Seed después de cada migración (es decir, llamada actualización base de
datos en la consola del administrador de paquetes) y este método filas de actualizaciones que ya se han insertado o
inserta si aún no existe.
Presione CTRL-SHIFT-B para construir el proyecto.(Los siguientes pasos se producirá un error si tu no construir en este
momento.)
El siguiente paso es crear una clase de DbMigration para la migración inicial. Esta migración a crea una nueva base de
datos, por eso borró el archivo movie.mdf en un paso anterior.
En la ventana de la Consola de administrador de paquetes , escriba el comando "add-migración inicial" para crear la
migración inicial. El nombre "Inicial" es arbitrario y se utiliza para nombrar el archivo de migración creado.
Migraciones primer código crea otro archivo de clase en la carpeta de migraciones (con el nombre{DateStamp}_Initial.cs ),
y esta clase contiene código que crea el esquema de base de datos. El nombre de archivo de migración es preventa con
una marca de tiempo para ayudar con el pedido. Examinar la {DateStamp}_Initial.csarchivo, contiene las instrucciones para
crear la tabla de películas para la DB de la película. Cuando se actualiza la base de datos en las instrucciones a
continuación, esto {DateStamp}_Initial.cs archivo funcionará y crear el el esquema de BD. Luego se ejecutará el método de
la semilla para rellenar la DB con datos de prueba.
En la Consola del administrador de paquetes, introduce el comando "actualización-base de datos" para crear la base de
datos y ejecutar el método de la semilla .
Si sale un error que indica una tabla ya existe y no puede ser creada, es probablemente porque funcionó la aplicación
después de que ha eliminado la base de datos y antes de que ejecute la update-database. En ese caso, elimine el archivo
de Movies.mdf otra vez y vuelva a intentar el comando de update-database . Si sigue obteniendo un error, elimine la
carpeta de las migraciones y contenido luego empezar con las instrucciones en la parte superior de esta página (que es
borrar el archivo Movies.mdf entonces procede a habilitar migraciones).
Ejecute la aplicación y vaya a la URL /Movies . Visualización de los datos de la semilla.
Agregar una propiedad de calificación para el modelo de la
película
Empezar por añadir una nueva propiedad de Rating a la clase de Movie existente. Abra el archivo Models\Movie.csy
agregue la propiedad Rating como éste:
public string Rating { get; set; }
La clase de Movie completa parece ahora el siguiente código:
public class Movie
{
public int ID { get; set; }
public string Title { get; set; }
public DateTime ReleaseDate { get; set; }
public string Genre { get; set; }
public decimal Price { get; set; }
public string Rating { get; set; }
}
Generar la aplicación usando el construir > Construir películas menú comando o pulsando CTRL-SHIFT-B.
Ahora que has actualizado la clase Model , también necesitamos actualizar las plantillas de
vista\Views\Movies\Index.cshtml y \Views\Movies\Create.cshtml con el fin de Mostrar la nueva propiedad de Rating en la
vista de navegador.
Abra el archivo \Views\Movies\Index.cshtml y agrega un encabezado de columna <th>Rating</th> justo después de la
columna de precio . Luego agregar una columna de <td> cerca del final de la plantilla para hacer
[email protected] valor. A continuación es lo que parece la plantilla de vista actualizada de Index.cshtml :
@model IEnumerable<MvcMovie.Models.Movie>
@{
ViewBag.Title = "Index";
}
<h2>Index</h2>
<p>
@Html.ActionLink("Create New", "Create")
</p>
<table>
<tr>
<th>
@Html.DisplayNameFor(model => model.Title)
</th>
<th>
@Html.DisplayNameFor(model => model.ReleaseDate)
</th>
<th>
@Html.DisplayNameFor(model => model.Genre)
</th>
<th>
@Html.DisplayNameFor(model => model.Price)
</th>
<th>
@Html.DisplayNameFor(model => model.Rating)
</th>
<th></th>
</tr>
@foreach (var item in Model) {
<tr>
<td>
@Html.DisplayFor(modelItem => item.Title)
</td>
<td>
@Html.DisplayFor(modelItem => item.ReleaseDate)
</td>
<td>
@Html.DisplayFor(modelItem => item.Genre)
</td>
<td>
@Html.DisplayFor(modelItem => item.Price)
</td>
<td>
@Html.DisplayFor(modelItem => item.Rating)
</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>
}
</table>
A continuación, abra el archivo \Views\Movies\Create.cshtml y agregue el siguiente marcado casi al final del
formulario. Esto representa un cuadro de texto para que se puede especificar una calificación cuando se crea una nueva
película.
<div class="editor-label">
@Html.LabelFor(model => model.Rating)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Rating)
@Html.ValidationMessageFor(model => model.Rating)
</div>
Ahora ha actualizado el código de la aplicación para apoyar la nueva propiedad de Rating .
Ahora ejecutar la aplicación y vaya a la URL /Movies . Al hacer esto, sin embargo, verá uno de los siguientes errores:
Estás viendo este error porque la clase de modelo de Movie actualizada en la aplicación ahora es diferente que el
esquema de la tabla de la Movie de la base de datos existente. (No hay ninguna Rating de columna en la tabla de base
de datos).
Existen algunos enfoques para resolver el error:
1. Tienen Entity Framework automáticamente soltar y volver a crear la base de datos basada en el nuevo esquema de
clase de modelo. Este enfoque es muy conveniente al hacer desarrollo activo en una base de datos de
prueba; permite evolucionar rápidamente el esquema de base de datos y modelo juntos. El lado negativo, sin
embargo, es que pierdes los datos existentes en la base de datos, por lo que no quiere utilizar este enfoque en una
base de datos de producción! Utilizar a un inicializador para automáticamente una base de datos con datos de
prueba de la semilla es a menudo una forma productiva para el desarrollo de una aplicación. Para obtener más
información sobre los inicializadores de la base de datos de Entity Framework, vea de Tom Dykstra tutorial de
ASP.NET MVC/Entity Framework.
2. Explícitamente modifica el esquema de la base de datos existente para que coincida con las clases del modelo. La
ventaja de este enfoque es que usted mantenga sus datos. Puede hacer este cambio ya sea manualmente o
mediante la creación de una base de datos cambiar el guión.
3. Utilice migraciones primer código para actualizar el esquema de base de datos.
Para este tutorial, usaremos las migraciones primer código.
Actualizar el método de la semilla para que proporciona un valor para la nueva columna. Abra el archivo
Migrations\Configuration.cs y agregar un campo de calificación a cada objeto de la película.
new Movie
{
Title = "When Harry Met Sally",
ReleaseDate = DateTime.Parse("1989-1-11"),
Genre = "Romantic Comedy",
Rating = "G",
Price = 7.99M
},
Construir la solución y luego abrir la ventana de la Consola de administrador de paquetes y escriba el siguiente
comando:
add-migration AddRatingMig
El comando de add-migration indica el marco de la migración para examinar el modelo actual de la película con el
actual esquema de BD de película y crear el código necesario para migrar la DB al nuevo modelo. El AddRatingMig es
arbitraria y se utiliza para nombrar el archivo de migración. Es útil usar un nombre significativo para el paso de la
migración.
Cuando termina de este comando, Visual Studio abre el archivo de clase que define la nueva clase derivada
deDbMIgration , y en el método de Up se puede ver el código crea la nueva columna.
public partial class AddRatingMig : DbMigration
{
public override void Up()
{
AddColumn("dbo.Movies", "Rating", c => c.String());
}
public override void Down()
{
DropColumn("dbo.Movies", "Rating");
}
}
Construir la solución e introduzca el comando "actualización de base de datos" en la ventana de la Consola de
administrador de paquetes .
La siguiente imagen muestra el resultado en la ventana de la Consola de administrador de paquetes (la fecha
anteponiendo AddRatingMig será diferente).
Vuelva a ejecutar la aplicación y vaya a la URL /Movies. Puedes ver el nuevo campo de calificación.
Haga clic en el enlace Crear nuevo para agregar una nueva película. Tenga en cuenta que puede agregar una calificación.
Haga clic en crear. La nueva película, incluida la clasificación, ahora aparece en las listado de películas:
También debe agregar el campo de Rating a las plantillas de vista edición, detalles y SearchIndex.
Puede escribir el comando "actualización de base de datos" en la ventana de la Consola de administrador de
paquetes otra vez y no se haría ningún cambio, porque el esquema coincide con el modelo.
En esta sección usted vio cómo puede modificar el modelo de objetos y mantener la base de datos sincronizados con los
cambios. También vimos una forma para llenar una base de datos recién creada con datos de la muestra para que usted
puede probar escenarios. A continuación, veamos cómo puede agregar lógica de validación más rico a las clases de
modelo y habilitar algunas reglas de negocios que se aplique.
Agregar validación del modelo
Adding Validation to the Model Por Rick Anderson|28 De agosto de 2012
En esto esta sección a añadir lógica de validación para el modelo de la Movie y usted garantizar que las reglas de
validación se aplican a cualquier momento que un usuario intenta crear o editar una película con la aplicación.
Mantener las cosas secas
Uno de los principios de diseño de base de ASP.NET MVC es seco ("Don't Repeat Yourself"). ASP.NET MVC anima a
especificar la funcionalidad o comportamiento sólo una vez, y luego que se refleja en todas partes en una aplicación. Esto
reduce la cantidad de código que necesita para escribir y hace el código que escriba menos error propenso y fácil de
mantener.
El apoyo de validación que ASP.NET MVC y entidad marco código primero es un gran ejemplo del principio seco en
acción. Mediante declaración puede especificar reglas de validación en un solo lugar (en la clase de modelo) y las reglas
se aplican en todas partes en la aplicación.
Echemos un vistazo a cómo puede tomar ventaja de este apoyo de validación en la aplicación de la película.
Agregar reglas de validación para el modelo de la película
Empezarás añadiendo algunos lógica de validación para la clase de Movie .
Abra el archivo Movie.cs . Agregue una instrucción using en la parte superior del archivo que hace referencia el espacio de
nombres System.ComponentModel.DataAnnotations :
using System.ComponentModel.DataAnnotations;
Tenga en cuenta que el espacio de nombres no contiene System.Web. DataAnnotations proporciona un conjunto
integrado de atributos de validación que se pueden aplicar de forma declarativa a cualquier clase o propiedad.
Ahora actualizar la clase de Movie para aprovechar las ventajas del
incorporado Required, StringLengthy Rangeatributos de validación. Utilice el código siguiente como un ejemplo de
cómo aplicar los atributos.
public class Movie {
public int ID { get; set; }
[Required]
public string Title { get; set; }
[DataType(DataType.Date)]
public DateTime ReleaseDate { get; set; }
[Required]
public string Genre { get; set; }
[Range(1, 100)]
[DataType(DataType.Currency)]
public decimal Price { get; set; }
[StringLength(5)]
public string Rating { get; set; }
}
Ejecute la aplicación y otra vez obtendrá el siguiente error en tiempo de ejecución:
El modelo de apoyo en el contexto de la 'MovieDBContext' ha cambiado desde la creación de la base de datos. Considere el uso de migraciones primer código para actualizar la base de
datos (http://go.microsoft.com/fwlink/?LinkId=238269).
Nos vamos a migraciones para actualizar el scheam. Construir la solución y luego abrir la ventana de la Consola de
administrador de paquetes y escriba los siguientes comandos:
add-migration AddDataAnnotationsMig
update-database
Cuando termina de este comando, Visual Studio abre el archivo de clase que define la nueva clase derivada
deDbMIgration con el nombre especificado (AddDataAnnotationsMig), y en el método de Up se puede ver el código
actualiza las restricciones de horario. Los campos Title y Genre son ya no acepta valores NULL (es decir, debe introducir
un valor) y el campo de Rating tiene una longitud máxima de 5.
Los atributos de validación especifican el comportamiento que desea aplicar en las propiedades del modelo que se
aplican. El atributo Required indica que una propiedad debe tener un valor; en este ejemplo, una película debe tener
valores para el Title, ReleaseDate, Genrey propiedades de Price para ser válidas. El atributo de la Rangerestringe un
valor dentro de un intervalo especificado. El atributo de StringLength le permite definir la longitud máxima de una
propiedad de cadena y, opcionalmente, su longitud mínima. Tipos intrínsecos (como decimal, int, float, DateTime)
están obligados por defecto y no necesita la Required atributo.
Código primero asegura que las reglas de validación que se especifica en una clase de modelo se aplican antes de la
aplicación guarda los cambios realizados en la base de datos. Por ejemplo, el código siguiente generará una excepción
cuando se llama al método SaveChanges , porque varios requiere propiedad de Movie son valores que faltan y el precio
es cero (que está fuera del rango válido).
MovieDBContext db = new MovieDBContext();
Movie movie = new Movie();
movie.Title = "Gone with the Wind";
movie.Price = 0.0M;
db.Movies.Add(movie);
db.SaveChanges(); // <= Will throw server side validation exception
Tener reglas de validación aplicadas automáticamente por .NET Framework ayuda a que su aplicación más
robusta. También asegura que no se olvide validar algo y sin darse cuenta dejó malos datos en la base de datos.
Aquí es un código completo listado para el archivo actualizado de Movie.cs :
using System;
using System.Data.Entity;
using System.ComponentModel.DataAnnotations;
namespace MvcMovie.Models {
public class Movie {
public int ID { get; set; }
[Required]
public string Title { get; set; }
[DataType(DataType.Date)]
public DateTime ReleaseDate { get; set; }
[Required]
public string Genre { get; set; }
[Range(1, 100)]
[DataType(DataType.Currency)]
public decimal Price { get; set; }
[StringLength(5)]
public string Rating { get; set; }
}
public class MovieDBContext : DbContext {
public DbSet<Movie> Movies { get; set; }
}
}
Error de validación UI en ASP.NET MVC
Vuelva a ejecutar la aplicación y vaya a la URL /Movies .
Haga clic en el enlace Crear nuevo para agregar una nueva película. Rellene el formulario con algunos valores no válidos
y haga clic en el botón crear .
Nota para apoyar la validación de jQuery para no-Inglés locales que usan una coma (",") para un punto decimal, debe
incluir la globalize.js y su archivo específico cultures/globalize.cultures.js(de https://github.com/jquery/globalize ) y
JavaScript para utilizar Globalize.parseFloat. El código siguiente muestra las modificaciones en el archivo
Views\Movies\Edit.cshtml para trabajar con la cultura "fr-FR":
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
<script src="~/Scripts/globalize.js"></script>
<script src="~/Scripts/globalize.culture.fr-FR.js"></script>
<script>
$.validator.methods.number = function (value, element) {
return this.optional(element) ||
!isNaN(Globalize.parseFloat(value));
}
$(document).ready(function () {
Globalize.culture('fr-FR');
});
</script>
<script>
jQuery.extend(jQuery.validator.methods, {
range: function (value, element, param) {
//Use the Globalization plugin to parse the value
var val = $.global.parseFloat(value);
return this.optional(element) || (
val >= param[0] && val <= param[1]);
}
});
</script>
}
Observe cómo el formulario automáticamente ha utilizado un color de borde rojo para resaltar los cuadros de texto que
contienen datos no válidos y ha emitido un mensaje de error de validación adecuado junto a cada uno.Los errores se
aplican client-side (usando JavaScript y jQuery) y servidor (en caso de que un usuario tiene JavaScript desactivado).
Un beneficio real es que no necesita cambiar una sola línea de código en la clase de MoviesController o en la vista
de Create.cshtml con el fin de permitir esta validación UI. El controlador y vistas que creó anteriormente en este tutorial
recogido automáticamente las reglas de validación especificado mediante atributos de validación en las propiedades de la
clase de modelo de la Movie .
Usted puede haber notado las propiedades Title y el Genre, el atributo requerido no se cumple hasta enviar el
formulario (golpeó el botón crear ), o introduzca texto en el campo de entrada y sacarla. Para un campo que está
inicialmente vacía (como los campos de la visión de crear) y que tiene sólo el atributo requerido y no otros atributos de
validación, puede hacer lo siguiente para activar la validación:
1. Ficha en el campo.
2. Introduzca algún texto.
3. Ficha hacia fuera.
4. Ficha en el campo.
5. Eliminar el texto.
6. Ficha hacia fuera.
La secuencia activará la validación necesaria sin golpear el botón "enviar". Simplemente golpear el botón "enviar" sin
entrar en cualquiera de los campos se activará la validación del lado del cliente. Los datos del formulario no se envían al
servidor hasta que no queden errores de validación del lado cliente. Puede comprobarlo poniendo un punto de
interrupción en el método HTTP Post o mediante la herramienta fiddler o el F12 developer tools de IE 9.
Cómo debe producirse la validación en el crear ve y crea el
método de acción
Te preguntarás cómo se generó la validación UI sin las actualizaciones al código en el controlador o vistas. El listado
siguiente muestra lo que parecen los métodos Create en la clase MovieController . Son igual de cómo se creó
anteriormente en este tutorial.
//
// GET: /Movies/Create
public ActionResult Create()
{
return View();
}
//
// POST: /Movies/Create
[HttpPost]
public ActionResult Create(Movie movie)
{
if (ModelState.IsValid)
{
db.Movies.Add(movie);
db.SaveChanges();
return RedirectToAction("Index");
}
return View(movie);
}
El primer método de acción (HTTP GET) Create muestra el formulario inicial de crear. La segunda versión ([HttpPost])
maneja el post de formulario. El segundo método de Create (la versión HttpPost ) llama aModelState.IsValid para
comprobar si la película tiene errores de validación. Llamar a este método evalúa los atributos de validación que se han
aplicado al objeto. Si el objeto tiene errores de validación, el método Createre-displays la forma. Si no hay ningún error,
el método guarda la nueva película en la base de datos. En nuestro ejemplo de película que estamos utilizando, la forma
no se registra en el servidor cuando se producen errores de validación detectados en el cliente; el
segundo Create nunca se llama al método. Si desactiva JavaScript en tu navegador, validación de cliente se desactiva y
el método HTTP POST Create llama a ModelState.IsValid para comprobar si la película tiene errores de validación.
Puede establecer un punto de interrupción en el método HttpPost Create y verificar nunca se llama al método,
validación del lado del cliente no presentará los datos del formulario cuando se detectan errores de validación. Si
desactivar JavaScript en su navegador, y enviar el formulario con errores, se puede golpear el punto de quiebre.Usted
todavía obtener validación completo sin JavaScript. La siguiente imagen muestra cómo deshabilitar JavaScript en Internet
Explorer.
La siguiente imagen muestra cómo deshabilitar JavaScript en el navegador FireFox.
La siguiente imagen muestra cómo deshabilitar JavaScript con el navegador Chrome.
A continuación es la plantilla de vista de Create.cshtml que usted escalonada anteriormente en el tutorial. Es utilizado por
los métodos de acción indicados tanto para mostrar la forma inicial y volver en caso de error.
@model MvcMovie.Models.Movie
@{
ViewBag.Title = "Create";
}
<h2>Create</h2>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")"></script>
@using (Html.BeginForm()) {
@Html.ValidationSummary(true)
<fieldset>
<legend>Movie</legend>
<div class="editor-label">
@Html.LabelFor(model => model.Title)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Title)
@Html.ValidationMessageFor(model => model.Title)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.ReleaseDate)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.ReleaseDate)
@Html.ValidationMessageFor(model => model.ReleaseDate)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Genre)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Genre)
@Html.ValidationMessageFor(model => model.Genre)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Price)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Price)
@Html.ValidationMessageFor(model => model.Price)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Rating)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Rating)
@Html.ValidationMessageFor(model => model.Rating)
</div>
<p>
<input type="submit" value="Create" />
</p>
</fieldset>
}
<div>
@Html.ActionLink("Back to List", "Index")
</div>
Observe cómo el código utiliza un ayudante de Html.EditorFor para el elemento <input> para cada propiedad de
la Movie de salida. Junto a este ayudante es una llamada al método de ayudante deHtml.ValidationMessageFor . Estos
dos métodos auxiliares de trabajo con el objeto de modelo que se pasa por el regulador a la vista (en este caso, un objeto
de la Movie ). Buscan automáticamente atributos de validación especificados en los mensajes de error de modelo y de la
pantalla según corresponda.
Lo que es realmente bueno sobre este enfoque es que la plantilla de vista de crear ni el controlador sabe algo acerca de
las reglas de validación real están aplicadas o aparece el mensaje de error específico. Las reglas de validación y las
cadenas de error se especifican solamente en la clase de Movie . Estas mismas reglas de validación se aplican
automáticamente a la vista Edit y cualquier otras vistas plantillas puede crear que edición el modelo.
Si desea cambiar la lógica de validación más adelante, puede hacerlo en su lugar exactamente un añadiendo atributos de
validación para el modelo (en este ejemplo, la clase de movie ). Usted no tendrá que preocuparse por diferentes partes
de la aplicación es incompatible con el cómo se hacen cumplir las reglas — toda lógica de validación será definida en un
solo lugar y en todas partes. Esto mantiene el código muy limpio y es fácil de mantener y evolucionar. Y significa que
usted estará completamente honrar el principio seco.
Agregar formato al modelo de la película
Abra el archivo Movie.cs y examinar la clase de Movie . El espacio de
nombresSystem.ComponentModel.DataAnnotations proporciona atributos de formato además el conjunto integrado
de atributos de validación. Ya hemos solicitado un valor de enumeración de DataType a la fecha de lanzamiento y a los
campos de precio. El código siguiente muestra las propiedades de Price con el atributo de DisplayFormatapropiado
y ReleaseDate .
[DataType(DataType.Date)]
public DateTime ReleaseDate { get; set; }
[DataType(DataType.Currency)]
public decimal Price { get; set; }
Los atributos de DataType no son atributos de validación, que se utilizan para contar el motor ver cómo hacer el código
HTML. En el ejemplo anterior, el atributo DataType.Date muestra las fechas de la película como fechas solamente, con
hora de salida. Por ejemplo, los siguientes atributos de DataType no validar el formato de los datos:
[DataType(DataType.EmailAddress)]
[DataType(DataType.PhoneNumber)]
[DataType(DataType.Url)]
Los atributos mencionados sólo proporcionan sugerencias para el motor de la vista formatear los datos (y atributos de la
fuente como <a> para URL y < a href="mailto:EmailAddress.com" > por correo electrónico. Puede utilizar el
atributo RegularExpression para validar el formato de los datos.
Un enfoque alternativo al uso de los atributos de DataType , puede establecer explícitamente un
valorDataFormatString . El código siguiente muestra la propiedad de la fecha de lanzamiento con una cadena de
formato de fecha (es decir, "d"). Se usaría para especificar que no desea tiempo como parte de la fecha de lanzamiento.
[DisplayFormat(DataFormatString = "{0:d}")]
public DateTime ReleaseDate { get; set; }
El siguiente código asigna la propiedad Price moneda.
[DisplayFormat(DataFormatString = "{0:c}")]
public decimal Price { get; set; }
A continuación se muestra la clase de Movie completa.
public class Movie {
public int ID { get; set; }
[Required]
public string Title { get; set; }
[DataType(DataType.Date)]
public DateTime ReleaseDate { get; set; }
[Required]
public string Genre { get; set; }
[Range(1, 100)]
[DataType(DataType.Currency)]
public decimal Price { get; set; }
[StringLength(5)]
public string Rating { get; set; }
}
Ejecute la aplicación y busque el controlador de Movies . La fecha de lanzamiento y el precio son bien formateados. La
imagen de abajo muestra la fecha de lanzamiento y precio utilizando "fr-FR" como la cultura.
La imagen de abajo muestra los mismos datos que aparecen con la referencia cultural predeterminada (Inglés US).
En la siguiente parte de la serie, a revisar la aplicación y hacer algunas mejoras a los métodos
de Details yDelete generados automáticamente.
Examinar los detalles y los métodos de eliminación Tutoriales
Por Rick Anderson|28 De agosto de 2012
En esta parte del tutorial, examinas los métodos generados automáticamente de Details y Delete .
Examinar los detalles y los métodos de eliminación
Examining the Details and Delete Methods Abrir el controlador de la Movie y examinar el método Details .
public ActionResult Details(int id = 0)
{
Movie movie = db.Movies.Find(id);
if (movie == null)
{
return HttpNotFound();
}
return View(movie);
}
Código primero facilita la búsqueda de datos mediante el método Find . Una característica de seguridad importante
construida en el método es que el código comprueba que el método Find ha encontrado una película antes de que el
código trata de hacer cualquier cosa con él. Por ejemplo, un hacker podría introducir errores en el sitio cambiando la URL
creada por los vínculos de http://localhost:xxxx/Movies/Details/1 a algo comohttp://localhost:xxxx/Movies/Details/12345 (o
algún otro valor que no representa una película real). Si no revisas para una película nula, una película null daría lugar a un
error de base de datos.
Examinar los métodos de Delete y DeleteConfirmed .
// GET: /Movies/Delete/5
public ActionResult Delete(int id = 0)
{
Movie movie = db.Movies.Find(id);
if (movie == null)
{
return HttpNotFound();
}
return View(movie);
}
//
// POST: /Movies/Delete/5
[HttpPost, ActionName("Delete")]
public ActionResult DeleteConfirmed(int id = 0)
{
Movie movie = db.Movies.Find(id);
if (movie == null)
{
return HttpNotFound();
}
db.Movies.Remove(movie);
db.SaveChanges();
return RedirectToAction("Index");
}
Tenga en cuenta que el método HTTP Get Delete no elimina la película especificada, devuelve una vista de la película
donde puede enviar (HttpPost) la supresión... Realizar una operación de eliminación en respuesta a un GET solicitar (o
para ello, realice una operación de edición, crear operación o cualquier otra operación que cambia datos) abre un agujero
de seguridad. Para obtener más información sobre esto, vea la entrada de blog de Stephen Walther ASP.NET MVC Tip #46
— no utiliza enlaces de eliminar porque crear agujeros de seguridad.
El método de HttpPost que borra los datos se denomina DeleteConfirmed a una firma única o el nombre del método
HTTP POST. Las firmas de dos métodos se muestran a continuación:
// GET: /Movies/Delete/5
public ActionResult Delete(int id = 0)
//
// POST: /Movies/Delete/5
[HttpPost, ActionName("Delete")]
public ActionResult DeleteConfirmed(int id = 0)
Common language runtime (CLR) requiere métodos sobrecargados para tener una firma única (mismo nombre de método
pero diferente lista de parámetros). Sin embargo, aquí necesita dos métodos de eliminar--Get--y puesto que ambos
tienen la misma firma. (Deben aceptar un único entero como parámetro).
Para arreglar esto, puede hacer un par de cosas. Uno es darle a los métodos diversos nombres. Eso es lo que hizo el
mecanismo de andamios en el anterior ejemplo. Sin embargo, esto presenta un pequeño problema: ASP.NET asigna
segmentos de una URL a métodos de acción por su nombre, y si cambia el nombre de un método, enrutamiento
normalmente sería capaz de encontrar ese método. La solución es lo que se ve en el ejemplo, que consiste en añadir el
atributo ActionName("Delete") al método DeleteConfirmed . Esto efectivamente realiza mapas para el sistema de
enrutamiento para que una dirección URL que incluye /Delete/ para una solicitud POST encontrará el método
de DeleteConfirmed .
Otra forma común para evitar un problema con métodos que tienen firmas y nombres idénticos es cambiar artificialmente
la firma del método POST para incluir un parámetro sin usar. Por ejemplo, algunos desarrolladores añadir un tipo de
parámetro FormCollection que se pasa al método POST y luego simplemente no utiliza el parámetro:
public ActionResult Delete(FormCollection fcNotUsed, int id = 0)
{
Movie movie = db.Movies.Find(id);
if (movie == null)
{
return HttpNotFound();
}
db.Movies.Remove(movie);
db.SaveChanges();
return RedirectToAction("Index");
}
Resumen
Ahora tienes una completa aplicación ASP.NET MVC que almacena los datos en una base de datos local de DB.Puede
crear, leer, actualizar, eliminar y buscar películas.
Próximos pasos
Después de haber construido y probado una aplicación web, el siguiente paso es ponerlo a disposición de otras personas
utilizan Internet. Para ello, se debe implementar a un proveedor de hospedaje. Microsoft ofrece alojamiento web gratis
para hasta 10 sitios web en una cuenta de prueba gratis de Windows Azure. Para obtener información sobre cómo
implementar un proyecto web de Visual Studio a un sitio Web de Windows Azure, consulte crear e implementar un sitio
web ASP.NET y base de datos SQL con Visual Studio. Este tutorial también muestra cómo utilizar la entidad marco código
primera migraciones para implementar su base de datos de SQL Server en la base de datos de SQL Azure del Windows
(anteriormente SQL Azure). Para obtener más información acerca de implementación, vea implementación de ASP.NET
Web contenido mapa.
Ahora me animo a pasar a nuestro nivel intermedio creando un marco de Entity Data Model para una aplicación de
ASP.NET MVC y MVC Music Store tutoriales, para explorar los artículos ASP.NET en MSDNy para comprobar hacia fuera
los muchos recursos http://asp.net/mvc para aprender más sobre ASP.NET MVC y videos! Los foros de ASP.NET MVC son
un buen lugar para hacer preguntas.