You are on page 1of 96

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

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. Nombre de su proyecto "MvcMovie" y haga clic enAceptar.NET MVC 4. Seleccione Visual C# a la izquierda y seleccione La aplicación Web ASP.otra manera para realizar tareas en el IDE. . en lugar de seleccionar el Nuevo proyecto de la página de Inicio . (Por ejemplo.

.En el cuadro de diálogo Nuevo proyecto de ASP. Deje laafeitadora como el motor de vista predeterminado. seleccione Aplicación de Internet.NET MVC 4 .

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.

seleccione Iniciar depuración.Desde el menú depurar . .

En la imagen siguiente.Cuando se ejecuta la aplicación. F5 hace que Visual Studio Inicie IIS Express y ejecutar la aplicación web. que en este caso se ejecuta la aplicación que usted sólo construido. un puerto aleatorio se utiliza para el servidor web. Cuando se ejecuta un proyecto web en Visual Studio. Visual Studio entonces lanza un navegador y abre la Página principal de la aplicación. probablemente veremos un número de puerto distinto.Observe que el método abreviado de teclado para empezar a depurar es F5. el número de puerto es 41788. . 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.

.Sacarlo de la caja esta plantilla predeterminada le da inicio.NET MVC. El siguiente paso es cambiar el funcionamiento de esta aplicación y aprender un poco sobre ASP. MVC es un patrón para el desarrollo de aplicaciones que son fáciles de mantener.  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. contactos y sobre las páginas. Cerrar el navegador y vamos a cambiar algo de código. 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. Añadir un controlador Adding a Controller Por Rick Anderson|28 De agosto de 2012 MVC está parado para model-view-controller. Nosotros ser cubriendo todos estos conceptos en esta serie de tutoriales y mostrarle cómo utilizarlos para crear una aplicación. También presta apoyo para registrarse y acceder y enlaces a Facebook y Twitter. recuperar datos de modelo y especificar plantillas de vista que devuelven una respuesta al navegador. bien diseñada y comprobable.

Nombre de su nuevo controlador "HelloWorldController". seleccione Agregar controlador. .Vamos a empezar por crear una clase de controlador. haga clic derecho en elcontroladores carpeta y a continuación. Dejar la plantilla predeterminada como controlador MVC vacío y haga clic en Agregar. En Explorador de soluciones.

cs. El archivo está abierto en el IDE.Aviso Explorador de soluciones que crea un nuevo archivo ha sido nombrado HelloWorldController. .

..Web.Sustituir el contenido del archivo con el código siguiente. using System.Controllers { public class HelloWorldController : Controller { // // GET: /HelloWorld/ public string Index() { return "This is my <b>default</b> action. namespace MvcMovie.Mvc.".Web. } // // GET: /HelloWorld/Welcome/ . using System.

.". } } } Los métodos del controlador devolverá una cadena de HTML como un ejemplo. En el navegador. No has usado el [Parameters] parte de la URL todavía. es http://localhost:1234/HelloWorld.. Para esta URL.NET MVC invoca otro regulador clases (y métodos de acción diferentes dentro de ellos) dependiendo de la URL de entrada. La segunda parte de la URL determina el método de acción en la clase a ejecutar. La lógica de enrutamiento de enlace por defecto utilizada por ASP. Tan /HelloWorld asigna a laHelloWorldController clase.) La página en el navegador se verá como la siguiente pantalla.. El controlador se denominaHelloWorldController y se llama el primer método anterior Index. . es el controlador HelloWorld y Welcome es el método de acción.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. En el método anterior.Ejecute la aplicación (presione F5 o Ctrl + F5).Tan /HelloWorld/Index causaría la Index método de la HelloWorldController clase a ejecutar.". Vamos a invocarlo desde un navegador. La asignación de MVC predeterminada es/[Controller]/ [ActionName]/[Parameters]. (Por ejemplo. public string Welcome() { return "This is the Welcome action method. Esto es porque un método denominado Index es el método por defecto que se llamará en un controlador. anexar "HelloWorld" a la ruta en la barra de direcciones. Me dijiste que el sistema sólo volver algunos HTML.. el código devuelto una cadena directamente. en la figura de abajo. y así fue! ASP. si uno no se especifica explícitamente. Tenga en cuenta que sólo tuvimos que buscar a /HelloWorld y el Index método fue utilizado por defecto. El Welcome método funciona y devuelve la cadena "Este es el método de acción ¡ Bienvenido. Vaya a http://localhost:xxxx/HelloWorld/Welcome.

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.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. NumTimes is: " + numTimes). /HelloWorld/bienvenida? nombre = Scott & numtimes = 4). Puedes probar diferentes valores para name y numtimes en la URL.HtmlEncode("Hello " + name + ". El sistema de fijación de ASP. public string Welcome(string name. Cambio su Welcome método para incluir dos parámetros como se muestra a continuación. } Ejecutar la aplicación y vaya a la URL de ejemplo (http://localhost:xxxx/HelloWorld/Welcome? name=Scott&numtimes=4). int numTimes = 1) { return HttpUtility. . 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.

Para ello.Cambiar el método de Index para devolver un objeto View . generalmente devuelven un ActionResult (o una clase derivada de ActionResult). Echemos un vistazo siguiente en cómo podemos hacer esto. como el método de Index anterior. } El método de Index anterior utiliza una plantilla de vista para generar una respuesta HTML al navegador. 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. la obra vista y controlador. los tipos primitivos no como cadena. . Métodos de controlador (también conocido como métodos de acción). Actualmente el método de Index devuelve una cadena con un mensaje codificado en la clase del controlador.NET MVC 3. 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. Normalmente no quieren controladores volver HTML directamente.cshtml extensión del archivo y proporcionar una manera elegante de crear HTML de salida utilizando C#. agregue una plantilla de vista que se puede utilizar con el método de Index . A crear un archivo de plantilla de vista utilizando el motor de vistas de maquinilla de afeitar con ASP.Enfoque basado en la maquinilla de afeitar las plantillas tienen un . El controlador está volviendo HTML directamente. puesto llega a ser muy incómodo al código.En tanto estos ejemplos el controlador viene realizando la parte de "VC" de MVC — es decir. codificación de flujo de trabajo. como se muestra en el siguiente código: public ActionResult Index() { return View(). normalmente usaremos un archivo de plantilla de vista separada para ayudar a generar la respuesta HTML. En el proyecto. haga clic derecho dentro del método de Index y haga clic en Agregar ver. En cambio.

Aparece el cuadro de diálogo Agregar ver .cshtml . Se los puede ver en el Explorador de soluciones: . 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.

A continuación muestra el archivo Index.cshtml que se creó: .

Title = "Index".cshtml y seleccione Mostrar en la página Inspector. . haga clic con el botón derecho el archivoIndex. en el explorador de soluciones.cshtml .Agregue el siguiente código HTML en la etiqueta <h2> . @{ ViewBag. } <h2>Index</h2> <p>Hello from our View Template!</p> Si está utilizando Visual Studio 2012. <p>Hello from our View Template!</p> A continuación se muestra el archivo completo de MvcMovie\Views\HelloWorld\Index.

La imagen de abajo muestra la cadena "Hola de nuestra plantilla de vista!" en la vista. El método de Index en su controlador no mucho trabajo. También puede ejecutar la aplicación y busque el controlador HelloWorld (http://localhost:xxxx/HelloWorld). . simplemente funcionó la declaración return View(). ASP.El Inspector página tutorial tiene más información acerca de esta nueva herramienta. Porque no especificar explícitamente el nombre del archivo de plantilla de vista utilizar. que especifica que el método debe utilizar un archivo de plantilla de vista para representar una respuesta al navegador.cshtml Ver archivo en la carpeta \Views\HelloWorld .NET MVC por defecto utilizando el Index.

usted quiere cambiar el título "tu logo aquí. Ese texto es común a todas las páginas. a pesar de que aparece en cada página de la aplicación. ." A continuación el enlace de "su logotipo aquí. Vamos a cambiar algunas de ellas. en la parte superior de la página. 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í. Vaya a la carpeta /Views/Shared en el Explorador de soluciones y abra el archivo_Layout. Realmente se implementa en un único lugar en el proyecto. Sin embargo. Este archivo se llama una página de diseño y es compartido "shell" que utilizan todas las demás páginas.Se ve bastante bien.cshtml ." registro y entrar en enlaces y por debajo de la que se vincula a la casa.". cerca y páginas de contacto. Cambiar puntos de vista y páginas de diseño En primer lugar.

si selecciona el enlace de sobre.cshtml se representa dentro del método RenderBody . el punto de vista Views\Home\About. Busque la línea de @RenderBody() . . "envueltas" en la página de diseño.Por ejemplo.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. RenderBody es un marcador de posición donde todas las páginas de vista que creas demuestran para arriba. Cambie el encabezado del título de sitio en la plantilla de diseño de "tu logo aquí" a la película"MVC".

Movie App</title> Ejecute la aplicación y observe que ahora dice "MVC Movie".cshtml. "Home")</p> </div> Reemplace el contenido del elemento title con el siguiente marcado: <title>@ViewBag. Hay dos lugares para hacer un cambio: en primer lugar.Title . . Te haces algo diferente para que pueda ver que poco de código cambia que parte de la aplicació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. Abrir MvcMovie\Views\HelloWorld\Index. el texto que aparece en el título del navegador y luego en el encabezado secundario (el elemento <h2> ). vamos a cambiar el título de la vista de índice.ActionLink("MVC Movie". "Index". también. Ahora.<div class="float-left"> <p class="site-title">@Html. Haga clic en el enlace de sobre y ver cómo esa página muestra "la película MVC".

cshtml ). 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. También se observa cómo el contenido de la plantilla de vista Index. Ejecute la aplicación y vaya a http://localhost:xx/HelloWorld.cshtml y el adicional "-película App" en el archivo de diseño.cshtml se fusionó con la plantilla de vista_Layout. La aplicación MVC tiene una "V" (ver) y ya tienes una "C" (controlador). fácilmente puede pasar otros parámetros entre la plantilla de la vista y el archivo de diseño. Nuestro poco de "datos" (en este caso el mensaje "Hola de nuestra plantilla de vista!") es modificable. } <h2>My Movie List</h2> <p>Hello from our View Template!</p> Para indicar el título HTML para mostrar. Si miras hacia atrás en el código de la plantilla de diseño. el título principal y los títulos secundarios.Title que hemos creado en la plantilla de vista de la Index. el código anterior establece una propiedad Title del objeto ViewBag(que es en la plantilla de vista de la Index. usted puede estar viendo contenido almacenado en caché.@{ ViewBag. (Si no ve cambios en el 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. sin embargo. Utilizando este enfoque ViewBag .cshtml y una sola respuesta HTML fue enviada al navegador. Tenga en cuenta que han cambiado el título del navegador. Presione CTRL+F5 en tu navegador para forzar la respuesta desde el servidor a cargarse).Title = "Movie List". pero no "M" (modelo) . El título del navegador se crea con la ViewBag.

Volver al archivo HelloWorldController. En lugar de tener el controlador representar esta respuesta como una cadena. Mantener esta "separación de preocupaciones" ayuda a mantener el código limpio.Mvc.Web. Plantillas de vista pueden utilizarse luego de un controlador para generar y dar formato a una respuesta HTML al navegador. Las clases del controlador se invocan en respuesta a una solicitud de enlace entrante. vamos a cambiar el controlador para usar una plantilla de vista en su lugar. caminaremos a través de cómo crear una base de datos y recuperar datos de modelo de él. primero hablemos pasando información del controlador a la vista. using System.NumTimes = numTimes.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. por lo que usted tiene que pasar brocas adecuadas de datos del controlador a la vista con el fin de generar la respuesta. ViewBag es un objeto dinámico. En cambio.cs y cambiar el método de Welcome para agregar un valor de Message yNumTimes al objeto ViewBag . } public ActionResult Welcome(string name.Controllers { public class HelloWorldController : Controller { public ActionResult Index() { return View(). Pasar datos del controlador a la vista Antes de ir a una base de datos y hablar de modelos. . recupera los datos de una base de datos y en última instancia decide qué tipo de respuesta para enviar hacia el navegador. Actualmente.cs se ve así: using System. ViewBag.Message = "Hello " + name. namespace MvcMovie. 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. una plantilla de vista debe trabajar sólo con los datos que es proporcionados por el controlador.Web. Una mejor práctica: una plantilla de vista nunca debe realizar la lógica de negocio o interactuar con una base de datos directamente. El archivo completo de HelloWorldController. Una clase de controlador es donde se escribe el código que controla el navegador entrante pide. comprobables y más fácil de mantener. sin embargo.Dentro de poco. 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. El sistema de fijación de ASP. Controladores son responsables de proporcionar cualquier información u objetos son necesaria para una plantilla de vista representar una respuesta al navegador. La plantilla de vista generará una respuesta dinámica. int numTimes = 1) { ViewBag.todavía. que significa que usted puede poner lo que quierasel objeto ViewBag no tiene ninguna propiedad definida hasta que ponga algo en su interior.

A continuación. return View(). necesita una plantilla de vista ¡ Bienvenido! En el menú generar . Luego haga clic derecho dentro del método Welcome y haga clic en Agregar ver. } } } Ahora el objeto ViewBag contiene datos que se pasarán automáticamente a la vista. . seleccione Crear MvcMovie para asegurarse de que el proyecto se compila.

.

cshtml . @{ ViewBag.cshtml .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. i < ViewBag. } <h2>Welcome</h2> <ul> @for (int i=0. A crear un bucle que dice "Hola" tantas veces como el usuario dice que debe. i++) { <li>@ViewBag.Title = "Welcome".Message</li> } </ul> Ejecute la aplicación y vaya a la siguiente URL: http://localhost:XX/HelloWorld/Welcome?name=Scott&numtimes=4 . A continuación se muestra el archivo completo de Welcome.NumTimes.

En el ejemplo anterior. Este último en el tutorial. La vista mostrará los datos como HTML al usuario. de "objetos CLR de llanura de . era una especie de "M" para el modelo. Entity Framework (a menudo denominado EF) apoya un paradigma de desarrollo llamado Primer código.(Estos son también conocidos como clases POCO. Usted usará una tecnología de acceso a datos de . 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. El enfoque del modelo de vista pasando datos se prefiere generalmente mucho sobre el enfoque de la bolsa de vista. usaremos un modelo de vista para pasar datos de un controlador a la vista. Ver la entrada de blogDinámico V fuertemente escribió Views para obtener más información. Bueno.Ahora datos es tomadas de la URL y pasados al controlador usando la carpeta del modelo. Estas clases será la parte de "modelo" de la aplicación ASP. El controlador paquetes los datos en un objeto ViewBag y pasa ese objeto a la vista.NET Framework conocida como el Entity Framework para definir y trabajar con estas clases de modelo.NET MVC. Código primero permite crear objetos del modelo escribiendo clases simples. utilizamos un objeto ViewBag para pasar los datos del controlador a la vista. pero no el tipo de base de datos.

Agregar clases de modelo En el Explorador de soluciones. Agregue las siguientes cinco propiedades a la clase de Movie : public class Movie { public int ID { get. } public DateTime ReleaseDate { get. set. set. seleccione Agregary seleccioneclase. Introduzca el nombre de la clase "Película". que permite un flujo de trabajo de desarrollo muy limpio y rápido. set.edad. } . haga clic derecho en la carpeta de modelos . } public string Title { get.") Con ella podrás tener la base de datos creada sobre la marcha de sus clases.

namespace MvcMovie. } } Vamos a usar la clase de Movie para representar películas en una base de datos.cs .Entity. } public decimal Price { get. (Varios usando declaraciones que no sean necesarios han sido removido. } public string Genre { get. En el mismo archivo. agregue la siguiente clase de MovieDBContext : public class MovieDBContext : DbContext { public DbSet<Movie> Movies { get. } public DateTime ReleaseDate { get. Con el fin de ser capaces de referencia DbContext y DbSet. Cada instancia de un objeto deMovie corresponderá a una fila de una tabla de base de datos. } } La clase MovieDBContext representa el contexto de la base de datos de película de Entity Framework.Data.Entity. set. set. } } } . debe añadir la siguiente instrucción using al principio del archivo: using System. set.) using System. set. ElMovieDBContext se deriva de la clase base DbContext de Entity Framework.Models { public class Movie { public int ID { get. } public string Title { get. A continuación se muestra el archivo completo de Movie. using System.Data. public string Genre { get. y cada propiedad de la clase de Movie se asigne a una columna en la tabla. } public decimal Price { get. que se encarga de obtener. set. } } public class MovieDBContext : DbContext { public DbSet<Movie> Movies { get. set. set. set. almacenar y actualizar instancias de la clase de Movie en una base de datos. set.

sin embargo.config de la aplicación.config en la carpeta Views . <add name="MovieDBContext" connectionString="Data Source=(LocalDB)\v11.Integrated Security=true" providerName="System. (No el archivo Web.config .Data. Añadir la siguiente cadena de conexión para el elemento <connectionStrings> en el archivo Web.SqlClient" /> En el ejemplo siguiente se muestra una porción del archivo Web.0.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.config de la aplicación raíz.config en rojo. es cómo especificar que se conectará a la base de datos.) Abra el archivoWeb.Initial Catalog=aspnet-MvcMovie- 2012213181139. Una pregunta.0.Integrated Security=True" providerName="System.Data. Abra el archivo Web.AttachDbFilename=| DataDirectory|\Movies.mdf. Harás agregando información de conexión en el archivoWeb.SqlClient" /> <add name="MovieDBContext" . que usted podría preguntarse.config con la nueva cadena de conexión agregada: <connectionStrings> <add name="DefaultConnection" connectionString="Data Source=(LocalDb)\v11.

A continuación. (Este es el valor por defecto). connectionString="Data Source=(LocalDB)\v11. . Seleccione las siguientes opciones:  Nombre del controlador: MoviesController. Generar la aplicación antes de pasar al siguiente paso.  Vistas: maquinilla de afeitar (CSHTML).AttachDbFilename=| DataDirectory|\Movies.mdf.Models). con Entity Framework. Las siguientes opciones no aparecerán hasta que construyes tu aplicación. Haga clic derecho en la carpeta Controllers y crear un nuevo controlador de MoviesController .  Modelo de clase: película (MvcMovie. 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.  Plantilla: Controlador MVC con acciones de lectura/escritura y vistas.Integrated Security=True" providerName="System. 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.  Clase de contexto de datos: MovieDBContext (MvcMovie. Acceso a datos de su modelo desde un controlador Por Rick Anderson|28 De agosto de 2012 En esta sección.0. (Predeterminado).Data.Models).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.

la solicitud de navegadorhttp://localhost:xxxxx/Movies es que efectivamente igual al navegador solicitar http://localhost:xxxxx/Movies/Index.asax ).Haga clic en Agregar. Delete.cshtml. leer.NET MVC 4 crea automáticamente el CRUD (crear. editar y borrar las entradas de la película. la petición de navegador http://localhost:xxxxx/Movies se dirige al método de acción de Indexpredeterminado del controlador de Movies . El resultado es una lista vacía de películas.  Create. 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). Ejecute la aplicación y busque el controlador de Movies añadiendo /Movies a la URL en la barra de direcciones del navegador.cshtmly Index. porque aún alguno no ha añadido.cshtml en la carpeta Views\Movies . En otras palabras. ASP. lista. Details. Ahora tienes una aplicación web completamente funcional que permite crear. Edit. .cshtml.  Una carpeta " películas " en la carpeta del proyecto Views .cshtml. Visual Studio Express crea los siguientes archivos y carpetas:  MoviesController.cs de un archivo en la carpeta de controladores . Porque la aplicación se basa en el valor predeterminado enrutamiento (definida en el archivoGlobal.

Entrar en algunos detalles acerca de una película y haga clic en el botón crear .Crear una película Seleccione el vínculo Crear nuevo . .

donde se puede ver la película recién creada en el listado. Luego está redirigido a la URL /Movies . .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.

editar y borrar peliculas. } La siguiente línea de la clase MoviesController crea un contexto de base de datos de la película. A continuación se muestra una porción del controlador de la película con el método de Index .ToList()). public class MoviesController : Controller { private MovieDBContext db = new MovieDBContext(). que son todo funcional. como se ha descrito anteriormente. .Crear un par más entradas de cine. // // GET: /Movies/ public ActionResult Index() { return View(db. Puede utilizar el contexto de la base de datos de la película para consultar.cs y examinar el método de Index generado. los datosy eliminar enlaces. Trate de Editar.Movies. private MovieDBContext db = new MovieDBContext(). Examinar el código generado Abra el archivo Controllers\MoviesController.

Examinar la plantilla de vista de la Index. if (movie == null) { return HttpNotFound(). Visual Studio incluye automáticamente la siguiente declaración de @model en la parte superior del archivo Details. ASP. } Si se encuentra una Movie . 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 . A continuación se muestra una porción del controlador de la película con el método de Details .cs examinar el método de Details generado. puede especificar el tipo de objeto que espera de la vista. Examinar el contenido del archivo Views\Movies\Details. el código pasa cada campo de película a losDisplayNameFor y ayudantes de DisplayFor HTML con el objeto de Model inflexible.cs .Models. Por ejemplo.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 . Mediante la inclusión de una declaración de @model en la parte superior del archivo de plantilla de vista.cshtml . Modelos inflexible y la palabra clave de @model Anteriormente en este tutorial.cshtml . en la plantilla de Details.cshtml : @model MvcMovie.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. } return View(movie). 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. El ViewBag es un objeto dinámico que proporciona una forma conveniente de enlazados para pasar información a la vista.cshtml y el método de Index en el archivo MoviesController. se pasa una instancia de la modelo de la Movie a la vista de detalles. Al crear el controlador de la película. El código pasa esta lista de Movies del controlador a la vista: public ActionResult Index() . En el archivo Controllers\MoviesController.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.Movies. usted vio cómo un controlador puede pasar datos u objetos a una plantilla de vista mediante el objeto ViewBag . Los métodos de crear y editar y vista plantillas también pasan un objeto de modelo de la película.NET MVC también ofrece la posibilidad de pasar fuertemente escribe datos u objetos a una plantilla de vista. public ActionResult Details(int id = 0) { Movie movie = db.Find(id).

cshtml : @model IEnumerable<MvcMovie.ID }) | @Html. en la plantilla de Index.Models.ActionLink("Delete".DisplayFor(modelItem => item. "Edit".Price) </td> <th> @Html. Por ejemplo.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. Entre otros beneficios.Rating) </th> <td> @Html.ID }) | @Html. cada objeto del item en el lazo se escribe como Movie.DisplayFor(modelItem => item.ID }) </td> </tr> } Porque el objeto del Model es inflexible (como un objeto IEnumerable<Movie> ). { id=item.DisplayFor(modelItem => item. 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.cshtml .ReleaseDate) </td> <td> @Html.DisplayFor(modelItem => item. "Details". 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: .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.{ return View(db. { id=item.Movies.DisplayFor(modelItem => item.Genre) </td> <td> @Html.Title) </td> <td> @Html.ActionLink("Details".ActionLink("Edit". new { id=item. "Delete".

.

. primer código creado automáticamente la base de datos. a continuación. Si no ves el archivo Movies.mdf . Haga doble clic en Movies. expanda la carpeta App_Data . 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 carpetatablas para ver la tabla de películas.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. Se puede comprobar que se ha creado por mirar en la carpeta App_Data .mdf para abrir el Explorador de base de datos.

 "Excepción InvalidOperation fue no controlada por el código de usuario" el SqlConnection suministrado no especifica un catálogo inicial.Nota: Si no aparece el explorador de base de datos. Esto forzará abrir el explorador de base de datos.MDF' no se puede abrir porque es versión 706. seleccioneconectar a la base de datosy cancelar el cuadro de diálogo Elegir origen de datos . en el menú Herramientas . . No se admite un camino de descenso de categoría. 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. Es necesario instalar las Herramientas de datos de SQL Server y LocalDB. 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. Verificar la cadena de conexión MovieDBContext especificada en la página anterior. Este servidor compatible con la versión anterior y 655.

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.

Mantenga el puntero del ratón sobre un enlace Editar para ver la dirección URL que enlaza con.Ejecute la aplicación y busque el controlador de Movies añadiendo /Movies a la URL en la barra de direcciones del navegador.ActionLink("Edit". El enlace Editar fue generado por el método de Html.Web. new { id=item.Mvc. "Edit". 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 .ActionLink en la vista de Views\Movies\Index.ID }) El objeto Html es un ayudante que se expone utilizando una propiedad en la clase baseSystem.WebViewPage .cshtml : @Html.

IgnoreRoute("{resource}. Por lo tanto.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. ASP.Optional } ). . action = "Index".cs) toma el patrón de URL {controller}/{action}/ {id}. El argumento final es un objeto Anónimo que genera los datos de la ruta (en este caso. <a>Edit Me</a>). routes. el ID de 4). } También puede pasar parámetros de método de acción utilizando una cadena de consulta. url: "{controller}/{action}/{id}". public static void RegisterRoutes(RouteCollection routes) { routes. defaults: new { controller = "Home".métodoActionLink es el enlace de texto para representar (por ejemplo. Por ejemplo. El segundo argumento es el nombre de invocar el método de acción.MapRoute( name: "Default". 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 . La ruta por defecto (establecida en App_Start\RouteConfig. Examine el código siguiente en el archivoApp_Start\RouteConfig. id = UrlParameter.axd/{*pathInfo}"). El vínculo generado que se muestra en la imagen anterior es http://localhost:xxxxx/Movies/Edit/4.cs .

if (movie == null) { return HttpNotFound().Abrir el controlador de Movies . Los dos métodos de acción Edit se muestran a continuación. } // // POST: /Movies/Edit/5 [HttpPost] . } return View(movie). // // GET: /Movies/Edit/5 public ActionResult Edit(int id = 0) { Movie movie = db.Movies.Find(id).

Si no se encuentra una película. El método de Edit HttpGet toma el parámetro ID de película. (Nos referiremos a los métodos de acción que implícitamente se asignaron el atributo HttpGet como HttpGet métodos). El parámetro ID especifica un valor predeterminado de cero si se llama al método Edit sin un parámetro.ID) <div class="editor-label"> @Html.State = EntityState.Modified.public ActionResult Edit(Movie movie) { if (ModelState. pero que no es necesario porque es el valor por defecto. En el ejemplo siguiente se muestra la vista Edit generado: @model MvcMovie.Movie @{ ViewBag.Models. } <h2>Edit</h2> @using (Html.BeginForm()) { @Html.ReleaseDate) </div> .SaveChanges().ValidationSummary(true) <fieldset> <legend>Movie</legend> @Html.ValidationMessageFor(model => model. Este atributo especifica que la sobrecarga del método Edit puede ser invocado sólo para solicitudes POST. return RedirectToAction("Index").HiddenFor(model => model. db. Cuando el sistema de andamios crea la vista Edit.EditorFor(model => model.Entry(movie). } Aviso el segundo método de acción Edit es precedido por el atributo HttpPost .Title = "Edit".IsValid) { db.Title) </div> <div class="editor-field"> @Html. se devuelveHttpNotFound . } return View(movie).Title) </div> <div class="editor-label"> @Html. examinó la clase de Movie y crea código para representar elementos <label> y <input> para cada propiedad de la clase. Se podría aplicar el atributo HttpGetpara el primer método de edición.LabelFor(model => model.Title) @Html. levanta la película usando el método de Entity Framework Find y devuelve la película seleccionada a la vista de edición.LabelFor(model => model.

Price) @Html.ReleaseDate) @Html.Genre) </div> <div class="editor-label"> @Html.EditorFor(model => model. Haga clic en un enlace de Editar .ActionLink("Back to List". El ayudante deHtml." id="ID" name="ID" type="hidden" value="4" /> . El ayudante deHtml.ValidationMessageFor(model => model. Ejecute la aplicación y vaya a la URL /Movies .ValidationMessageFor muestra los mensajes de validación asociados con esa propiedad. En el navegador.Genre) </div> <div class="editor-field"> @Html.Models. El código escalonado utiliza varios métodos auxiliares para optimizar el código HTML. ver el origen de la página. <div class="editor-field"> @Html.LabelFor muestra el nombre del campo ("Title".Genre) @Html." data-val-required="The ID field is required.Movie en la parte superior del archivo.LabelFor(model => model. "ReleaseDate". "Género" o "Precio").EditorFor representa un elemento HTML <input> .ValidationMessageFor(model => model. A continuación se muestra el código HTML del elemento de formulario. especifica que la vista espera que el modelo de la plantilla de vista de tipo Movie. El ayudante de Html. "Index") </div> @section Scripts { @Scripts.Price) </div> <p> <input type="submit" value="Save" /> </p> </fieldset> } <div> @Html.LabelFor(model => model.Price) </div> <div class="editor-field"> @Html. <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.ReleaseDate) </div> <div class="editor-label"> @Html.ValidationMessageFor(model => model.Render("~/bundles/jqueryval") } Observe cómo la plantilla de vista tiene una declaración de @model MvcMovie.EditorFor(model => model.EditorFor(model => model.

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 ." data-val-required="The ReleaseDate field is required." data-val-required="The Price field is required." id="Price" name="Price" type="text" value="2." 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. <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. Los datos del formulario se registrará en el servidor cuando se hace clic en el botón Editar . Procesar la petición POST .

Entry(movie). incluyendo los cambios que acaba de hacer. } return View(movie). return RedirectToAction("Index").cshtml cuidar de Mostrar mensajes de error apropiado. Los nuevos datos de la película se guardan en la base de datos llamando al método SaveChanges de MovieDBContext.IsValid) { db. Los ayudantes deHtml.State = EntityState. db. que muestra la de colección de películas. ellos se volverán a Mostrar en el formulario. [HttpPost] public ActionResult Edit(Movie movie) { if (ModelState.Modified.NET MVC toma los valores de forma publicada y crea un objeto de Movie que se pasa como parámetro del movie .ValidationMessageFor en la plantilla de vista de Edit.El listado siguiente muestran la versión HttpPost del método de acción Edit .IsValid verifica que los datos presentados en forma pueden usarse para modificar (edición o actualización) un objeto de Movie . el código redirige al usuario al método de acción del Index de la clase MoviesController . Después de guardar los datos. 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). Si los valores publicados no válidos.SaveChanges(). El método ModelState. . } La carpeta del modelo ASP.

cultures. debe incluir la globalize.cshtml para trabajar con la cultura "fr-FR": @section Scripts { @Scripts. El código siguiente muestra las modificaciones en el archivo Views\Movies\Edit.js(de https://github.") para un punto decimal.com/jquery/globalize ) y JavaScript para utilizar Globalize.js"></script> <script src="~/Scripts/globalize.Nota para apoyar la validación de jQuery para no-Inglés locales que usan una coma (".js y su archivo específico cultures/globalize.parseFloat.Render("~/bundles/jqueryval") <script src="~/Scripts/globalize.js"></script> <script> .fr-FR.culture.

web> <globalization culture ="en-US" /> <!--elements removed for clarity--> </system. que especifica que las solicitudes GET no deben cambiar el estado de su aplicación.parseFloat(value)). </script> } El campo decimal puede requerir un campo común.ready(function () { Globalize. no un punto decimal. $. El código siguiente muestra el elemento de la globalización con la cultura en Español de Estados Unidos. </script> <script> jQuery. 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. Mostrando la forma de SearchIndex .config de proyectos. param) { //Use the Globalization plugin to parse the value var val = $. return this.web> Todos los métodos de HttpGet siguen un patrón similar.validator. } $(document).optional(element) || !isNaN(Globalize.NET MVC Tip #46 – no utiliza enlaces de eliminar porque crear agujeros de seguridad. como se describe en la entrada de blog post ASP. El método Create pasa un objeto de película vacío a la vista de la creación. Esto estará disponible usando la URL /Movies/SearchIndex . en el caso de Index) y pasar el modelo a la vista. 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. Obtener un objeto de película (o lista de objetos. Como una solución temporal.number = function (value. 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.validator. Cuando un usuario envía el formulario. element. }).global.culture('fr-FR'). { range: function (value.parseFloat(value). <system. Modificar datos en un método HTTP GET es un riesgo de seguridad. } }).methods. edición. La solicitud mostrará un formulario HTML que contiene elementos de entrada que un usuario puede escribir con el fin de buscar una película.optional(element) || ( val >= param[0] && val <= param[1]).extend(jQuery.methods. puede agregar el elemento de la globalización para el archivo raíz web.Modificación de datos en un método GET también viola las mejores prácticas HTTP y el patrón arquitectónico delresto . borrar o modifican datos de hacen en la sobrecarga HttpPostdel método. element) { return this. Todos los métodos que crean.

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. } El s => s. la consulta de películas se modifica para filtrar en el valor de la cadena de búsqueda. Haga clic derecho dentro del método SearchIndex y haga clic en Agregar ver. pero aún no ha sido dirigida contra el almacén de datos. elija de la listay. haga clic en Agregar. Aquí está el código: public ActionResult SearchIndex(string searchString) { var movies = from m in db. } return View(movies). a continuación.Where(s => s.Contains(searchString)).Movies select m. En la lista de plantillas de andamio .Comience agregando un método de acción SearchIndex a la clase de MoviesController existente. } La primera línea del método SearchIndex crea la siguiente consulta LINQ para seleccionar las películas: var movies = from m in db. utilice el siguiente código: if (!String.Movies select m. La consulta se define en este momento. Las consultas LINQ no se ejecutan cuando se definen o cuando son modificados por llamar a un método como Where o OrderBy. Para obtener más información sobre la ejecución de la consulta diferidos.Title código anterior es una Expresión Lambda. if (!String. En la muestra de SearchIndex . El método devuelve una vista que contiene un formulario HTML.Title. Si el parámetro searchString contiene una cadena.Contains(searchString)).IsNullOrEmpty(searchString)) { movies = movies.Title. 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. ver la Ejecución de la consulta. ejecución de la consulta es diferida. se ejecuta la consulta en la vista SearchIndex. .IsNullOrEmpty(searchString)) { movies = movies.Where(s => s. 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 cambio. Ahora puede implementar la visión SearchIndex que mostrará el formulario para el usuario.

Examinó la clase de Movie y crea código para representar elementos de <label> para cada propiedad de la clase.Title = "SearchIndex".Models. Visual Studio genera automáticamente (escalonada) algunos marcado por defecto en la vista. El listado a continuación muestra la visión de crear que se generó: @model IEnumerable<MvcMovie. El andamiaje había creado un formulario HTML.cshtml .Al hacer clic en el botón Agregar . } <h2>SearchIndex</h2> <p> @Html. "Create") </p> <table> <tr> <th> Title </th> <th> . Porque elegiste lalista en la lista de plantilla del andamio .ActionLink("Create New".Movie> @{ ViewBag. se crea la plantilla de vista Views\Movies\SearchIndex.

ID }) </td> </tr> } </table> Ejecute la aplicación y vaya a /Movies/SearchIndex. ReleaseDate </th> <th> Genre </th> <th> Price </th> <th></th> </tr> @foreach (var item in Model) { <tr> <td> @Html.Genre) </td> <td> @Html. new { id=item.DisplayFor(modelItem => item.ID }) | @Html. .DisplayFor(modelItem => item.ReleaseDate) </td> <td> @Html.ID }) | @Html. Añadir una cadena de consulta como ? searchString=ghost a la URL.ActionLink("Details". Se muestran las películas filtradas. new { id=item.ActionLink("Edit". "Details". "Delete".Title) </td> <td> @Html.DisplayFor(modelItem => item. "Edit". new { id=item.ActionLink("Delete".DisplayFor(modelItem => item.Price) </td> <td> @Html.

Title. } El método modificado de SearchIndex sería como sigue: .asax . el parámetro id coincidirá con el marcador de posición de {id} para las rutas por defecto en el archivo Global. } return View(movies).IsNullOrEmpty(searchString)) { movies = movies.Si cambia la firma del método SearchIndex para tener un parámetro denominado id.Where(s => s.Movies select m.Contains(searchString)). {controller}/{action}/{id} El método de SearchIndex original se ve así:: public ActionResult SearchIndex(string searchString) { var movies = from m in db. if (!String.

Sin embargo. var movies = from m in db. cambiarlo para que el método SearchIndex toma un parámetro de cadena denominado searchString: . } 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.Movies select m. no pueden esperar los usuarios modificar la URL cada vez desean buscar una película.public ActionResult SearchIndex(string id) { string searchString = id. Ahora usted añadiremos UI para ayudar a filtran películas.Contains(searchString)).Title. } return View(movies).IsNullOrEmpty(searchString)) { movies = movies. if (!String. Si cambiaste la firma del método SearchIndex para probar cómo pasar el parámetro ID de ruta-limite.Where(s => s.

. Ejecute la aplicación y trate de buscar una película. "Create").ActionLink("Create New".BeginForm causa la forma a sí mismo cuando el usuario envía el formulario haciendo clic en el botón de filtro . @model IEnumerable<MvcMovie.Title = "SearchIndex". "Create") @using (Html.Where(s => s.Title. } Abra el archivo Views\Movies\SearchIndex.cshtml y justo después de @Html. } <h2>SearchIndex</h2> <p> @Html.TextBox("SearchString")<br /> <input type="submit" value="Filter" /></p> } En el ejemplo siguiente se muestra una porción del archivo Views\Movies\SearchIndex.BeginForm()){ <p> Title: @Html. El ayudante de Html.cshtml con el marcado de filtrado adicional.IsNullOrEmpty(searchString)) { movies = movies. agregar lo siguiente: @using (Html.TextBox("SearchString") <br /> <input type="submit" value="Filter" /></p> } </p> El ayudante de Html.Models.Contains(searchString)).ActionLink("Create New".public ActionResult SearchIndex(string searchString) { var movies = from m in db.BeginForm crea una abertura <form> etiqueta.BeginForm()){ <p> Title: @Html.Movie> @{ ViewBag.Movies select m. } return View(movies). if (!String.

} . 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.No hay ninguna sobrecarga HttpPost del método SearchIndex . sólo filtrado de datos. porque el método no es cambiar el estado de la aplicación. Se podría agregar el siguiente método HttpPost SearchIndex . En ese caso. [HttpPost] public string SearchIndex(FormCollection fc. string searchString) { return "<h3> From [HttpPost]SearchIndex: " + searchString + "</h3>". No es necesario.

Reemplace el método sin parámetros existente de la BeginForm con lo siguiente: @using (Html. Derecho ahora.BeginForm("SearchIndex". . la URL contiene una cadena de consulta de búsqueda. existe una limitación en cómo esto todos se implementó. incluso si agrega esta versión HttpPost del método SearchIndex .Sin embargo. 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. 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. 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 . Busca también irá al método de acción HttpGet SearchIndex . la información de la cadena de búsqueda se envía al servidor como el valor de un campo de formulario.FormMethod."Movies". Esto significa que usted no puede capturar esa información de búsqueda para marcar o enviar a amigos en una dirección URL. incluso si tienes un método HttpPost SearchIndex .Get)) Ahora cuando usted envía una búsqueda.

var GenreQry = from d in db. .Movies orderby d.Movies select m.AddRange(GenreQry. borrar ahora. ViewBag. añades una característica para permitir a los usuarios buscar películas por género.Distinct()). string searchString) { var GenreLst = new List<string>().Genre.Genre select d. GenreLst.Añadir búsqueda por género Si ha agregado la versión HttpPost del método SearchIndex . A continuación. var movies = from m in db.movieGenre = new SelectList(GenreLst). Reemplace el método de SearchIndex con el siguiente código: public ActionResult SearchIndex(string movieGenre.

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.Contains(searchString)).Genre == movieGenre)). } Agregar marcado a la vista de SearchIndex para apoyar la búsqueda por género Añadir un ayudante de Html. la comedia se agregarán dos veces en nuestra muestra). (Sin el modificador Distinct .FormMethod.Genre select d. var GenreQry = from d in db.Title. if (string.Where(s => s. El código entonces almacena la lista de géneros en el objeto ViewBag . else { return View(movies. movieGenre.Where(x => x. El código siguiente muestra cómo comprobar el parámetro movieGenre . "All") ."Movies".Movies orderby d.DropDownList("movieGenre".IsNullOrEmpty(movieGenre)) return View(movies).cshtml . } if (string. el código más limita la consulta de películas para limitar las películas seleccionadas para el género especificado. Si no está vacío. es decir.IsNullOrEmpty(searchString)) { movies = movies.ActionLink("Create New".Genre.IsNullOrEmpty(movieGenre)) return View(movies). "Create") @using (Html.BeginForm("SearchIndex". A continuación se muestra el marcado terminado: <p> @Html. El código siguiente es una consulta LINQ que recupera todos los géneros de la base de datos. 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.Genre == movieGenre)).DropDownList en el archivo Views\Movies\SearchIndex.Where(x => x. if (!String. justo antes de la ayudante de TextBox . else { return View(movies. } } Esta versión del método SearchIndex toma un parámetro adicional.Get)){ <p>Genre: @Html. se agregarían duplicados géneros — por ejemplo.

. En la siguiente sección.TextBox("SearchString") <input type="submit" value="Filter" /></p> } </p> Ejecute la aplicación y vaya a /Movies/SearchIndex. por el nombre de la película y por ambos criterios. 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. 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. Intente una búsqueda por género. Title: @Html. En esta sección se examinan los métodos de acción CRUD y vistas generadas por el marco. 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.

mdf desde el explorador de soluciones para abrir la herramienta de base de datos. Configuración de migraciones primer código para modelar los cambios Si está utilizando Visual Studio 2012. . 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. Haga clic derecho sobre el archivo Movies. utilice el explorador de objeto de servidor SQL. Visual Studio Express para Web mostrará el explorador de base de datos.Si no están sincronizados. Si está utilizando Visual Studio 2010. Entity Framework produce un error. La herramienta de base de datos (Database Explorer. Navegar hacia el explorador de soluciones. haga doble clic en el archivo Movies.De forma predeterminada. que Visual Studio 2012 mostrará el explorador de servidores.mdf y seleccione borrar para eliminar la base de datos de películas. como lo hizo anteriormente en este tutorial. cuando se utiliza código de entidad marco primera para crear automáticamente una base de datos. 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. 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.

haga clic en Gestor de paquetes de biblioteca y luego la Consola del administrador de paquetes. Desde el menú Herramientas . En la ventana de la Consola de administrador de paquetes en el PM> el símbolo del sistema escriba "Enable-migraciones .ContextTypeName MvcMovie.MovieDBContext". .Generar la aplicación para asegurarse de que no hay ningún error.Models.

cs con el siguiente código: protected override void Seed(MvcMovie. new Movie { Title = "When Harry Met Sally".Title.Parse("1989-1-11"). Visual Studio abre el archivo Configuration.Models.AddOrUpdate( i => i.cs en una nueva carpeta demigraciones . Genre = "Romantic Comedy".El comando Enable-migraciones (mostrado arriba) crea un archivo Configuration.cs . Price = 7.MovieDBContext context) { context.Movies. Reemplace el método de la Seed en el archivo Configuration. ReleaseDate = DateTime.99M .

usandoMvcMovie. Price = 8.Models. ReleaseDate = DateTime. . Genre = "Western".99M } ). } Haga clic derecho sobre la línea serpenteante roja bajo la Movie y seleccionar resolver luego. }. Genre = "Comedy". ReleaseDate = DateTime. Genre = "Comedy". new Movie { Title = "Ghostbusters 2".99M }.Parse("1959-4-15"). new Movie { Title = "Rio Bravo".99M }. Price = 3.Parse("1984-3-13"). new Movie { Title = "Ghostbusters ". ReleaseDate = DateTime. Price = 9.Parse("1986-2-23").

escriba el comando "add-migración inicial" para crear la migración inicial. 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. Examinar la {DateStamp}_Initial.Hacerlo añade la siguiente instrucción using: using MvcMovie. introduce el comando "actualización-base de datos" para crear la base de datos y ejecutar el método de la semilla . contiene las instrucciones para crear la tabla de películas para la DB de la película.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. Migraciones primer código llama al método de Seed después de cada migración (es decir. y esta clase contiene código que crea el esquema de base de datos. El nombre "Inicial" es arbitrario y se utiliza para nombrar el archivo de migración creado.(Los siguientes pasos se producirá un error si tu no construir en este momento. Migraciones primer código crea otro archivo de clase en la carpeta de migraciones (con el nombre{DateStamp}_Initial. . En la ventana de la Consola de administrador de paquetes . esto {DateStamp}_Initial. En la Consola del administrador de paquetes.Models.csarchivo. Cuando se actualiza la base de datos en las instrucciones a continuación.mdf en un paso anterior. Presione CTRL-SHIFT-B para construir el proyecto. El nombre de archivo de migración es preventa con una marca de tiempo para ayudar con el pedido. por eso borró el archivo movie. Esta migración a crea una nueva base de datos.cs ).) El siguiente paso es crear una clase de DbMigration para la migración inicial.

Ejecute la aplicación y vaya a la URL /Movies . 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. Si sigue obteniendo un error.mdf otra vez y vuelva a intentar el comando de update- database .mdf entonces procede a habilitar migraciones). En ese caso. elimine el archivo de Movies.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. Visualización de los datos de la semilla. .

} public DateTime ReleaseDate { get. Abra el archivo Models\Movie. set. } public string Genre { get. set.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.csy agregue la propiedad Rating como éste: public string Rating { get. } public string Rating { get. } public decimal Price { get. set. set. set. set. } La clase de Movie completa parece ahora el siguiente código: public class Movie { public int ID { get. } } . set. } public string Title { get.

DisplayNameFor(model => model. Ahora que has actualizado la clase Model .DisplayFor(modelItem => item.DisplayNameFor(model => model.ReleaseDate) </th> <th> @Html.Genre) </th> <th> @Html.DisplayNameFor(model => model.cshtml con el fin de Mostrar la nueva propiedad de Rating en la vista de navegador.Movie> @{ ViewBag.Title) </td> <td> @Html.cshtml y \Views\Movies\Create.Title = "Index".DisplayNameFor(model => model. A continuación es lo que parece la plantilla de vista actualizada de Index.Rating) </th> <th></th> </tr> @foreach (var item in Model) { <tr> <td> @Html.Genre) </td> <td> . Luego agregar una columna de <td> cerca del final de la plantilla para hacer el@item.ActionLink("Create New". "Create") </p> <table> <tr> <th> @Html.ReleaseDate) </td> <td> @Html.DisplayNameFor(model => model. Abra el archivo \Views\Movies\Index.cshtml y agrega un encabezado de columna <th>Rating</th> justo después de la columna de precio .Title) </th> <th> @Html. también necesitamos actualizar las plantillas de vista\Views\Movies\Index.Models. } <h2>Index</h2> <p> @Html.cshtml : @model IEnumerable<MvcMovie.DisplayFor(modelItem => item.Generar la aplicación usando el construir > Construir películas menú comando o pulsando CTRL-SHIFT- B.Rating valor.DisplayFor(modelItem => item.Price) </th> <th> @Html.

ID }) </td> </tr> } </table> A continuación. Ahora ejecutar la aplicación y vaya a la URL /Movies .ActionLink("Edit".ID }) | @Html.DisplayFor(modelItem => item.ActionLink("Details".EditorFor(model => model. "Edit". <div class="editor-label"> @Html.ActionLink("Delete". new { id=item. "Delete". verá uno de los siguientes errores: . sin embargo. abra el archivo \Views\Movies\Create.Rating) </td> <td> @Html.Price) </td> <td> @Html. Al hacer esto.ValidationMessageFor(model => model. "Details".Rating) </div> Ahora ha actualizado el código de la aplicación para apoyar la nueva propiedad de Rating .Rating) </div> <div class="editor-field"> @Html. new { id=item. Esto representa un cuadro de texto para que se puede especificar una calificación cuando se crea una nueva película.ID }) | @Html.DisplayFor(modelItem => item.Rating) @Html.LabelFor(model => model. new { id=item. @Html.cshtml y agregue el siguiente marcado casi al final del formulario.

3. permite evolucionar rápidamente el esquema de base de datos y modelo juntos. es que pierdes los datos existentes en la base de datos. sin embargo. Este enfoque es muy conveniente al hacer desarrollo activo en una base de datos de prueba. vea de Tom Dykstra tutorial de ASP.NET MVC/Entity Framework. Tienen Entity Framework automáticamente soltar y volver a crear la base de datos basada en el nuevo esquema de clase de modelo. . Existen algunos enfoques para resolver el error: 1. Para obtener más información sobre los inicializadores de la base de datos de Entity Framework. (No hay ninguna Rating de columna en la tabla de base de datos). 2. Puede hacer este cambio ya sea manualmente o mediante la creación de una base de datos cambiar el guión. usaremos las migraciones primer código.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. 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 este tutorial. La ventaja de este enfoque es que usted mantenga sus datos. Utilice migraciones primer código para actualizar el esquema de base de datos. Explícitamente modifica el esquema de la base de datos existente para que coincida con las clases del modelo. El lado negativo.

Visual Studio abre el archivo de clase que define la nueva clase derivada deDbMIgration .99M }.Parse("1989-1-11"). c => c. Price = 7. 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. new Movie { Title = "When Harry Met Sally". y en el método de Up se puede ver el código crea la nueva columna. Puedes ver el nuevo campo de calificación. Genre = "Romantic Comedy". El AddRatingMig es arbitraria y se utiliza para nombrar el archivo de migración.Actualizar el método de la semilla para que proporciona un valor para la nueva columna.Movies". } public override void Down() { DropColumn("dbo. La siguiente imagen muestra el resultado en la ventana de la Consola de administrador de paquetes (la fecha anteponiendo AddRatingMig será diferente). "Rating"). Cuando termina de este comando. Vuelva a ejecutar la aplicación y vaya a la URL /Movies. public partial class AddRatingMig : DbMigration { public override void Up() { AddColumn("dbo.cs y agregar un campo de calificación a cada objeto de la película. Es útil usar un nombre significativo para el paso de la migración. . ReleaseDate = DateTime. Rating = "G".String()). Abra el archivo Migrations\Configuration. "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 .Movies".

Haga clic en el enlace Crear nuevo para agregar una nueva película. . Tenga en cuenta que puede agregar una calificación.

ahora aparece en las listado de películas: .Haga clic en crear. incluida la clasificación. La nueva película.

También debe agregar el campo de Rating a las plantillas de vista edición. En esta sección usted vio cómo puede modificar el modelo de objetos y mantener la base de datos sincronizados con los cambios. 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. 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. porque el esquema coincide con el modelo. detalles y SearchIndex. A continuación. Agregar validación del modelo Adding Validation to the Model Por Rick Anderson|28 De agosto de 2012 . 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.

Ahora actualizar la clase de Movie para aprovechar las ventajas del incorporado Required. set. 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.cs . } [Required] public string Title { get.Currency)] public decimal Price { get. 100)] [DataType(DataType. ASP.ComponentModel. set. Echemos un vistazo a cómo puede tomar ventaja de este apoyo de validación en la aplicación de la película. } [DataType(DataType. Tenga en cuenta que el espacio de nombres no contiene System. set.Date)] public DateTime ReleaseDate { get. y luego que se refleja en todas partes en una aplicación.NET MVC y entidad marco código primero es un gran ejemplo del principio seco en acción. DataAnnotations proporciona un conjunto integrado de atributos de validación que se pueden aplicar de forma declarativa a cualquier clase o propiedad.DataAnnotations : using System. Agregue una instrucción using en la parte superior del archivo que hace referencia el espacio de nombres System. El apoyo de validación que ASP.ComponentModel.DataAnnotations. public class Movie { public int ID { get. Mantener las cosas secas Uno de los principios de diseño de base de ASP. set. } [Range(1. 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 . } [Required] public string Genre { get. set.NET MVC anima a especificar la funcionalidad o comportamiento sólo una vez.Web.NET MVC es seco ("Don't Repeat Yourself"). StringLengthy Rangeatributos de validación. Abra el archivo Movie. Utilice el código siguiente como un ejemplo de cómo aplicar los atributos. set. 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. } [StringLength(5)] public string Rating { get. } } Ejecute la aplicación y otra vez obtendrá el siguiente error en tiempo de ejecución: .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.

su longitud mínima. int. } . Aquí es un código completo listado para el archivo actualizado de Movie. set. ReleaseDate. db. } [Required] public string Genre { get.SaveChanges(). // <= Will throw server side validation exception Tener reglas de validación aplicadas automáticamente por .Entity. debe introducir un valor) y el campo de Rating tiene una longitud máxima de 5.Date)] public DateTime ReleaseDate { get. 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. porque varios requiere propiedad de Movie son valores que faltan y el precio es cero (que está fuera del rango válido).Models { public class Movie { public int ID { get. una película debe tener valores para el Title. set.NET Framework ayuda a que su aplicación más robusta. set. Por ejemplo. También asegura que no se olvide validar algo y sin darse cuenta dejó malos datos en la base de datos. el código siguiente generará una excepción cuando se llama al método SaveChanges . using System.0M.Title = "Gone with the Wind". Tipos intrínsecos (como decimal. Considere el uso de migraciones primer código para actualizar la base de datos (http://go. DateTime) están obligados por defecto y no necesita la Required atributo.cs : using System. El atributo de la Rangerestringe un valor dentro de un intervalo especificado. Movie movie = new Movie(). movie. El atributo Required indica que una propiedad debe tener un valor.Add(movie).Data. Nos vamos a migraciones para actualizar el scheam. } [Required] public string Title { get. Genrey propiedades de Price para ser válidas. Los atributos de validación especifican el comportamiento que desea aplicar en las propiedades del modelo que se aplican.El modelo de apoyo en el contexto de la 'MovieDBContext' ha cambiado desde la creación de la base de datos. Los campos Title y Genre son ya no acepta valores NULL (es decir. 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). namespace MvcMovie. set. db.Movies.Price = 0.com/fwlink/?LinkId=238269). movie. opcionalmente.microsoft. using System. MovieDBContext db = new MovieDBContext(). El atributo de StringLength le permite definir la longitud máxima de una propiedad de cadena y. float. en este ejemplo. } [DataType(DataType.DataAnnotations.ComponentModel. y en el método de Up se puede ver el código actualiza las restricciones de horario.

. set. set. [Range(1. } [StringLength(5)] public string Rating { get.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. } } public class MovieDBContext : DbContext { public DbSet<Movie> Movies { get. Rellene el formulario con algunos valores no válidos y haga clic en el botón crear . set. } } } Error de validación UI en ASP. 100)] [DataType(DataType.Currency)] public decimal Price { get.

parseFloat.Nota para apoyar la validación de jQuery para no-Inglés locales que usan una coma (". debe incluir la globalize.cshtml para trabajar con la cultura "fr-FR": @section Scripts { @Scripts.") para un punto decimal.culture.js"></script> .com/jquery/globalize ) y JavaScript para utilizar Globalize.Render("~/bundles/jqueryval") <script src="~/Scripts/globalize.js(de https://github. El código siguiente muestra las modificaciones en el archivo Views\Movies\Edit.js y su archivo específico cultures/globalize.fr-FR.cultures.js"></script> <script src="~/Scripts/globalize.

<script> $. element. Simplemente golpear el botón "enviar" sin entrar en cualquiera de los campos se activará la validación del lado del cliente. 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. . el atributo requerido no se cumple hasta enviar el formulario (golpeó el botón crear ).ready(function () { Globalize. Ficha en el campo.parseFloat(value).cshtml con el fin de permitir esta validación UI.extend(jQuery. } }).optional(element) || !isNaN(Globalize. } $(document). Los datos del formulario no se envían al servidor hasta que no queden errores de validación del lado cliente. 4. param) { //Use the Globalization plugin to parse the value var val = $. </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. 2.global. return this. Introduzca algún texto. 5. Eliminar el texto. o introduzca texto en el campo de entrada y sacarla.parseFloat(value)).validator.culture('fr-FR').methods. 3. }).number = function (value. La secuencia activará la validación necesaria sin golpear el botón "enviar". </script> <script> jQuery. 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 .Los errores se aplican client-side (usando JavaScript y jQuery) y servidor (en caso de que un usuario tiene JavaScript desactivado). 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.methods. 6.validator. 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. { range: function (value. Ficha hacia fuera. Ficha en el campo. element) { return this. puede hacer lo siguiente para activar la validación: 1. Usted puede haber notado las propiedades Title y el Genre. Ficha hacia fuera.optional(element) || ( val >= param[0] && val <= param[1]).

El listado siguiente muestra lo que parecen los métodos Create en la clase MovieController . // // GET: /Movies/Create .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. Son igual de cómo se creó anteriormente en este tutorial.

El segundo método de Create (la versión HttpPost ) llama aModelState.public ActionResult Create() { return View().Usted todavía obtener validación completo sin JavaScript. } return View(movie). La siguiente imagen muestra cómo deshabilitar JavaScript en Internet Explorer. validación del lado del cliente no presentará los datos del formulario cuando se detectan errores de validación. 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 primer método de acción (HTTP GET) Create muestra el formulario inicial de crear.Add(movie). y enviar el formulario con errores. return RedirectToAction("Index").Movies. el método Createre-displays la forma. Puede establecer un punto de interrupción en el método HttpPost Create y verificar nunca se llama al método. db. el método guarda la nueva película en la base de datos.IsValid para comprobar si la película tiene errores de validación. 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. . Llamar a este método evalúa los atributos de validación que se han aplicado al objeto. } // // POST: /Movies/Create [HttpPost] public ActionResult Create(Movie movie) { if (ModelState. Si desactivar JavaScript en su navegador. La segunda versión ([HttpPost]) maneja el post de formulario.IsValid para comprobar si la película tiene errores de validación.SaveChanges(). Si no hay ningún error. se puede golpear el punto de quiebre.IsValid) { db. Si el objeto tiene errores de validación.

.

. La siguiente imagen muestra cómo deshabilitar JavaScript con el navegador Chrome.La siguiente imagen muestra cómo deshabilitar JavaScript en el navegador FireFox.

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

La imagen de abajo muestra la fecha de lanzamiento y precio utilizando "fr-FR" como la cultura.Date)] public DateTime ReleaseDate { get. } [Required] public string Genre { get. [DisplayFormat(DataFormatString = "{0:c}")] public decimal Price { get. "d"). set.Currency)] public decimal Price { get. La fecha de lanzamiento y el precio son bien formateados.cadena de formato de fecha (es decir. [DisplayFormat(DataFormatString = "{0:d}")] public DateTime ReleaseDate { get. } [Required] public string Title { get. set. set. } } Ejecute la aplicación y busque el controlador de Movies . set. } A continuación se muestra la clase de Movie completa. } [Range(1. Se usaría para especificar que no desea tiempo como parte de la fecha de lanzamiento. set. set. } [StringLength(5)] public string Rating { get. } [DataType(DataType. . public class Movie { public int ID { get. set. set. } El siguiente código asigna la propiedad Price moneda. 100)] [DataType(DataType.

.La imagen de abajo muestra los mismos datos que aparecen con la referencia cultural predeterminada (Inglés US).

Examinar los detalles y los métodos de eliminación Tutoriales Por Rick Anderson|28 De agosto de 2012 En esta parte del tutorial. . a revisar la aplicación y hacer algunas mejoras a los métodos de Details yDelete generados automáticamente.En la siguiente parte de la serie. 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 .

Movies.. crear operación o cualquier otra operación que cambia datos) abre un agujero de seguridad. Realizar una operación de eliminación en respuesta a un GET solicitar (o para ello. if (movie == null) { return HttpNotFound(). 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). return RedirectToAction("Index").Movies. ActionName("Delete")] public ActionResult DeleteConfirmed(int id = 0) { Movie movie = db. vea la entrada de blog de Stephen Walther ASP. Para obtener más información sobre esto. Examinar los métodos de Delete y DeleteConfirmed .Remove(movie). 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. } Tenga en cuenta que el método HTTP Get Delete no elimina la película especificada. Por ejemplo. } // // POST: /Movies/Delete/5 [HttpPost.Find(id). } Código primero facilita la búsqueda de datos mediante el método Find . devuelve una vista de la película donde puede enviar (HttpPost) la supresión.public ActionResult Details(int id = 0) { Movie movie = db. . db. if (movie == null) { return HttpNotFound(). una película null daría lugar a un error de base de datos.. if (movie == null) { return HttpNotFound(). Si no revisas para una película nula. realice una operación de edición. } return View(movie).Find(id).Movies. // GET: /Movies/Delete/5 public ActionResult Delete(int id = 0) { Movie movie = db. } return View(movie).Movies.NET MVC Tip #46 — no utiliza enlaces de eliminar porque crear agujeros de seguridad. } db.SaveChanges().Find(id).

Puede crear. Sin embargo. La solución es lo que se ve en el ejemplo.El método de HttpPost que borra los datos se denomina DeleteConfirmed a una firma única o el nombre del método HTTP POST. Uno es darle a los métodos diversos nombres.Remove(movie). aquí necesita dos métodos de eliminar--Get--y puesto que ambos tienen la misma firma. 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. 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.NET asigna segmentos de una URL a métodos de acción por su nombre. int id = 0) { Movie movie = db. } db. Eso es lo que hizo el mecanismo de andamios en el anterior ejemplo. leer. (Deben aceptar un único entero como parámetro). enrutamiento normalmente sería capaz de encontrar ese método. actualizar. if (movie == null) { return HttpNotFound(). eliminar y buscar películas. Para arreglar esto. y si cambia el nombre de un método. return RedirectToAction("Index"). Sin embargo. esto presenta un pequeño problema: ASP. 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. 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 . } Resumen Ahora tienes una completa aplicación ASP. que consiste en añadir el atributo ActionName("Delete") al método DeleteConfirmed . 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).Find(id). puede hacer un par de cosas.Movies. Por ejemplo. . db.SaveChanges().NET MVC que almacena los datos en una base de datos local de DB.Movies.

Para obtener más información acerca de implementación. 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). Ahora me animo a pasar a nuestro nivel intermedio creando un marco de Entity Data Model para una aplicación de ASP.NET MVC son un buen lugar para hacer preguntas. el siguiente paso es ponerlo a disposición de otras personas utilizan Internet.NET Web contenido mapa.net/mvc para aprender más sobre ASP. Microsoft ofrece alojamiento web gratis para hasta 10 sitios web en una cuenta de prueba gratis de Windows Azure. consulte crear e implementar un sitio web ASP.NET en MSDNy para comprobar hacia fuera los muchos recursos http://asp. se debe implementar a un proveedor de hospedaje.Próximos pasos Después de haber construido y probado una aplicación web. vea implementación de ASP. .NET MVC y MVC Music Store tutoriales.NET y base de datos SQL con Visual Studio. Para ello.NET MVC y videos! Los foros de ASP. para explorar los artículos ASP. Para obtener información sobre cómo implementar un proyecto web de Visual Studio a un sitio Web de Windows Azure.