Para comenzar mi andadura aquí en Geeks, y también con esta plataforma, voy a escribir acerca de como crear un modelo de datos en nuestra aplicación ASP. NET MVC y sobre como podemos mostrar los datos que extraemos del mismo de forma sencilla.
Lo primero que vamos a hacer es crear nuestra base de datos, donde almacenaremos la información que queremos mostrar en la página, que en nuestro caso serán un conjunto de libros. Hacemos clic con el botón derecho sobre App_Data, y seleccionamos Add > New Item, de tipo SQL Server DataBase, y le damos el nombre de BooksDB.mdf.
*Por defecto todos los elementos de tipo de datos que vayamos a utilizar en nuestra aplicación web, se deben almacenar en la carpeta App_Data. Si no lo hacemos así, la propia aplicación se encargará de preguntárnoslo.
Una vez creada nuestra base de datos (BookDB.mdf) , hacemos doble clic sobre la misma y se nos desplegará en el Explorador de Servidores. Dentro de Books.mdf, hacemos clic con el botón derecho sobre Tables , y seleccionamos Add > New Table.
Dentro de la tabla, vamos a añadir los campos específicos que queremos que tengan cada uno de los elementos de nuestra tabla, que en nuestro caso son: bookID (int), Titulo (nchar), Autor (nchar), y deseleccionamos la opción “Allow Nulls”, ya que nuestros elementos deben contener las tres propiedades definidas, y no se pueden quedar ninguno en blanco.
A continuación, establecemos como Primary Key la columna bookID de nuestra tabla, y ponemos su propiedad IsIdentity a True .
Finalmente guardamos nuestra tabla dándole el nombre de Books.
Una vez creada la tabla, vamos a introducir algunos elementos a la misma. Para ello, hacemos clic con el botón derecho sobre Books, seleccionamos Show Table Data, y añadimos los libros que queremos mostrar inicialmente.
A continuación es necesario crea un modelo que nos permita conectar nuestra aplicación con la base de datos, para ello vamos a la carpeta Models > Add > New Item. Seleccionamos un elemento de tipo ADO.NET Entity Data Model que llamaremos BookModel, y vamos siguiendo el Wizard, tal y como se puede observar en las siguientes imágenes.
De esta forma ya tenemos creado nuestro modelo, que tendrá el siguiente aspecto, y al que cambiaremos el nombre de Books por Book.
Una vez creado el modelo, vamos a crear la vista y el controlador que nos permitan interactuar con él. Para ello, primero vamos a la carpeta Controllers, eliminamos el archivo HomeController que se nos ha creado por defecto y añadimos otro llamado igual, haciendo clic con el botón derecho mediante Add > Controller. Para este, seleccionaremos la opción de añadir los métodos Create, Update y Details, de forma que no sólo podamos ver los elementos de nuestro modelo, sino que también podamos editarlos o crear nuevos, como veremos en el próximo articulo.
Si accedemos al código del controlador, podemos ver que hay varios métodos de tipo ActionResult. Estos son los que se encargan de lanzar las acciones especificas que se deben realizar en cada vista. En nuestro caso, queremos asociar la acción Index con una vista que nos permita mostrar en la página principal una lista con todos los elementos de nuestro modelo. Para ello eliminamos previamente, la vista Index, que se encuentra dentro de las carpetas Views > Home, y creamos una nueva vista haciendo clic con el botón derecho en Index() dentro del archivo HomeController.cs, tal y como se ve en la imagen.
Al crear una nueva vista debemos definir una serie de parámetros, en función de lo que queremos mostrar y cómo. Dejamos el nombre que toma por defecto (Index), y seleccionamos la opción Create a strongly-typed view. Como View Data Class, escogemos MvcBookApp.Models.Book. *Si esta opción no nos aparece inicialmente, es necesario depurar la aplicación y volver a repetir este último paso.
Y como View content, debemos seleccionar List, ya que queremos que dicha vista nos muestre nuestro elementos en formato lista. El resto de parámetros los dejamos tal y como están, y pulsamos Add. Como vemos, la vista que se nos crea es una página .aspx, por lo que podemos modificar la interfaz de la misma a través de este archivo, bien en modo diseño o de código.
Por último volvemos a HomeController.cs, donde crearemos una instancia a nuestra entidad del modelo de datos:
- MvcBookApp.Models.BooksDBEntities mbook = new Models.BooksDBEntities();
Y modificaremos el resultado de la acción de Index, para que se muestre nuestra entidad de datos a través de una lista. El código de la misma será el siguiente:
- public ActionResult Index()
- {
- return View(mbook.Books.ToList());
- }
Si compilamos nuestra aplicación (F5) veremos que nos aparece la lista con nuestro libros, pero no podemos interactuar con ella, ya que no hemos definido ni las vistas, ni las acciones del controlador que nos lo permitan. Esto lo veremos en el siguiente Post 😉
¡¡Así que seguid atentos!!
