Selección múltiple de elementos

Vamos a generar un código para extraer información de BBDD, pudiendo hacerse una selección de múltiples elementos, y mostrarlo en una vista sencilla:

La Web forma parte de un proyecto ASP.NET Web Aplication utilizando el Modelo Vista Controlador (MVC), por lo que cada parte de código tiene definida su situación dentro del proyecto.

Queremos conseguir un listado de productos existentes en varios almacenes. Podremos seleccionar qué almacenes queremos visualizar, uno o varios.

Partimos de dos tablas, una tabla descriptiva de los almacenes y otra de los productos existentes:

En la zona de Views nos crearemos una vista, que llamaremos SeleccionMultiplesProductos:

En la zona del controlador nos crearemos un Controller para esta zona que permita que se carguen las páginas y se manden y reciban los elementos que deseemos:

En la zona de modelo primeramente nos crearemos un nuevo ítem que nos servirá como contexto para trabajar.

Usaremos un extractor de BDML,  toma metadatos de una base de datos como entrada y genera un archivo DBML como resultado. De forma más sencilla, generamos una archivo dbml que nos sirve para incluir las tablas de BBDD que deseemos y las convierte en Clases con las que trabajar en nuestro entorno. No necesitamos crear las Clases con sus características porque las genera automáticamente tomando cada columna como una característica con el nombre definido en BBDD.

Una vez Incluido las tablas que deseemos en el Contexto vamos a generar el código para obtener el listado de almacenes existentes en la tabla ALMACENES.

Creamos una clase dentro del directorio Models llamada ModeloDatosProducto. En ella primero nos creamos un Modelo de datos para poder trabajar con él y luego nos creamos un constructor de la propia clase en las que estamos trabajando e instanciamos este modelo:

public class ModeloDatosProducto
{
ContextoProductoDataContext contexto; –> creamos nuestro modelo

public ModeloDatosProducto() –> El constructor para, dentro de él, instanciar el contexto y poder trabajar con él
{
this.contexto = new ContextoProductoDataContext();
}
}

Una vez hecho esto, podemos crear un método para extraer los Almacenes, como el resultado es un listado de almacenes, con todas sus características, hay que indicárselo:

public List<ALMACENE> GetAlmacenes()
{
var consulta = from datos in contexto.ALMACENEs
select datos;
return consulta.ToList();
}

El resultado va a ser una lista de elementos, en este caso ALMACENES, con las características de BBDD.

Para mostrarlo en la Vista primero tenemos que ir al Controlador de nuestra zona para definir tanto el modelo (igual que hicimos anteriormente con el contexto) como la ruta a los modelos de nuestro proyecto:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

using ProyectoMVC.Models; –> tiene apuntar a los modelos de nuestro proyecto

namespace ProyectoMVC.Controllers

{
public class ProductosController : Controller
{
     ModeloDatosProducto modelo;
     public ProductosController()
     {
            this.modelo = new ModeloDatosProducto();
      }

Hay que definir un método GET, el que carga la página por primera vez, y utilizamos la propiedad ViewBag para enviar el listado de objetos ALMACENES. Le damos en este caso el nombre listaalmacen:

// GET: Productos
public ActionResult SeleccionMultiplesProductos()
{
ViewBag.listaalmacen = modelo.GetAlmacenes();
return View();
}

Ya en la vista vamos a recibir el ViewBag. En la parte superior definimos qué tipo de elemento es este ViewBag:

@{
List<ProyectoMVC.Models.ALMACENE> listaalmacen = ViewBag.listaalmacen;
}

Al cargar la página nos tiene que aparecer un listado de los almacenes existentes, que incluiremos dentro de una lista no ordenada, siendo cada opción un checkbox:

<form method=»post»>
<h3>ALMACENES: </h3>
<ul>

@foreach (var almancen in listaalmacen)
{
<li>
<input type=»checkbox» name=»almacenes» value=»@almancen.COD_ALMANCEN»/>@almancen.NALMACEN
</li>
}

</ul>
<br />
<button type=»submit» class=»btn-success»>VER PRODUCTOS</button>
</form>

El resultado al cargar la página es el siguiente:

Para extraer los diferentes productos que hay en cada almacén vamos a generar otro método en ModeloDatosProducto. Este método tendrá como parámetros de entrada un listado de números (los códigos de almacén):

public List<PRODUCTO> getProducoAlmacen(List<int> numeros)

{
var consulta = from datos in contexto.PRODUCTOs
where numeros.Contains(datos.COD_ALMACEN) –> La consulta de LINQ nos permite cribar por varios números
select datos;

return consulta.ToList();
}

En el controlador tendremos que definir un método POST para recibir los parámtros mediante el formulario y enviar a la vista el listado de Productos.

// POST: Productos
[HttpPost]
//Se le pasa como parámetros un array de números, los códigos de almacen seleccionados, que en la vista están definidos como <input type=»checkbox» name=»almacenes» value=»@almancen.COD_ALMANCEN«/>

public ActionResult SeleccionMultiplesProductos(int[] almacenes)
{
ViewBag.listaalmacen = modelo.GetAlmacenes(); –> Obtenemos dde nuevo el listado de almacenes para que se muestren siempre en la Vista
List<int> numeros = new List<int>();
foreach (int num in almacenes)
{
numeros.Add(num); –> Añadimos los números de array de entrada en la lista creada
}

List<PRODUCTO> productos = modelo.getProducoAlmacen(numeros); –> Por último, pasamos la lista como parámetros para el método de obtención de productos.

return View(productos); –> Devolvemos a la Vista el listado de Productos
}

En la Vista, arriba, tenemos que definir cual es el modelo que vamos a recibir. No es obligatorio, pero es útil, para que la Vista reconozca el tipo de objeto con el que trabajamos:

@model List<ProyectoMVC.Models.PRODUCTO>

Y, para mostrar el resultado, también en la Vista, vamos a crear una tabla:

<div>
@if (Model != null) –> Para que no se cree la tabla en la vista si no  se recibe información del controlador
{
<h4 style=»color:red»>PRODUCTOS</h4>
<table border=»1″>
<tr>
<th>ALMACÉN</th>
<th>PRODUCTO</th>
<th>CANTIDAD</th>
</tr>

@foreach (var p in Model)
{
<tr>
<td>@p.COD_ALMACEN</td>
<td><b>@p.NPRODUCTO</b></td>
<td>@p.CANTIDAD</td>
</tr>
}
</table>
}
</div>

El resultado es el siguiente:

Al utilizar el contexto a partir del fichero dbml hemos evitado tener que crearnos las clases con sus características y tener que utilizar un procedimiento almacenado en BBDD. También sería correcto, pero nos llevaría más tiempo realizarla y el código sería más complejo.

Descripción: Selección de múltiples elementos con Linq.

Autor: Raúl Martín Guzmán

Curso: Microsoft MCSD Web Applications + SharePoint Apps

Centro: Tajamar

Año académico: 2016-2017

https://es.linkedin.com/in/raúl-martín-guzmán-aa9908114