Aplicación web con ASP.NET MVC 2 – parte 6

Continuando con el controlador AdministrarPE implementaremos la parte de mostrar el historial de cuatrimestres para el PE seleccionado.

La acción HistorialPE (JsonResult)

Se encargará de devolver la lista de cuatrimestres de los años anteriores al actual en un tipo de datos JSON, la cual será invocada con JQuery al hacer clic sobre el link “Mostrar historial”.

Dada la situación de que la lista de cuatrimestres proveniente de nuestra base de datos no la podemos transformar a JSON, debemos crearnos una clase auxiliar llamada AuxCuatrimestre, esta clase debemos crearla en la carpeta Models, el código para esta clase es:

namespace EscuelaWebApp.Models
{
    public class AuxCuatrimestre
    {
        private int id;
        private string periodo;
        private int anio;

        public int Id
        {
            get { return id; }
            set { id = value; }
        }

        public string Periodo
        {
            get { return periodo; }
            set { periodo = value; }
        }

        public int Anio
        {
            get { return anio; }
            set { anio = value; }
        }

    }
}

Ahora, el código de nuestra acción HistorialPE que devuelve JSON es:

        [ActionName("HistorialPE")]
        public JsonResult HistorialPE(int id)
        {
            var cuatrimestres = BD.Cuatrimestre.Where(c => c.IdPE == id 
&& c.Anio < DateTime.Now.Year).ToList();
            List<AuxCuatrimestre> historial = new List<AuxCuatrimestre>();

            foreach (Cuatrimestre cuatrimestre in cuatrimestres)
                historial.Add(
                    new AuxCuatrimestre {
                        Id = cuatrimestre.Id,
                        Periodo = cuatrimestre.PeriodoInicio.Trim() + " - " 
+ cuatrimestre.PeriodoFin.Trim(),
                        Anio = cuatrimestre.Anio
                    });

            return this.Json(historial, JsonRequestBehavior.AllowGet);
        }

Editar el archivo cuatrimestres.js

Complementemos el JS para que al hacer clic en Mostrar historial, realice la consulta JSON y cargue en tiempo de ejecución los cuatrimestres en la tabla correspondiente.

Entonces a nuestro JS le agregamos:

//Cuando de clic sobre MostrarHistorial
var historialcargado=false;
$("#mostrarh").live("click", function(event){

	//comprobar ya se ha cargado el historial
    if(historialcargado==false)
	{
		//cargar el historial con JSON
		var url ="/AdministrarPE/HistorialPE/"+$("#IdPE").val();
		//hacer la llamada JSON
		$.getJSON(url,
			function(data) {
				 $.each(data, function(i, item) {
					//agregar los datos a la tabla 
"historialtbl"
					var fila= "<tr><td>"+item.Id+"</td>"
+"<td>"+item.Periodo+"</td>"+"<td>"+item.Anio+"</td></tr>";
					$("#historialtbl").append(fila);
				});
				historialcargado=true;
		});
	}

	//mostrar el historial
	$("#historial").slideToggle("slow");

});

Verifiquemos que funcione.

Img. 1. Mostrando el historial.

Mostrar el historial ahora esta funcionando, continuemos ahora con la parte de eliminar cuatrimestres.

Eliminar cuatrimestres.

Creemos la acción correspondiente.

        // GET: /AdministrarPE/EliminarCuatrimestre
        public ActionResult EliminarCuatrimestre(int id)
        {
            //buscar el cuatrimestre
            var cuatrimestre = BD.Cuatrimestre.Where(c => 
c.Id == id).FirstOrDefault();

            //si el cuatrimestre existe
            if (cuatrimestre != null)
            {
                //comprobar que el cuatrimestre no tenga ningún grupo creado
                if (cuatrimestre.Grupo.Count == 0)
                {
                    //pasar el cuatrimestre a la vista para eliminarlo
                    return View(cuatrimestre);
                }
                else
                {
                    //si tiene grupos, mostrar una notificación con otra vista
                    return View("ErrorEliminar");
                }
            }
            else
                return View("Error"); //si no existe
        }

Antes de crear la vista correspondiente, modifiquemos la vista ProgramaEducativo para que el link eliminar nos lleve a la acción EliminarCuatrimestre:

actualmente el link se crea con <%: Html.ActionLink(“Eliminar”, “Delete”, new { id=item.Id })%>

modificado quedaría:

            <%
          //solo si el cuatrimestre no tiene ningún grupo, mostrar el link
               if(item.Grupo.Count == 0)
               {
            %>
                  <%: Html.ActionLink("Eliminar", "EliminarCuatrimestre", 
new { id = item.Id }) %>
            <%
               }
             %>

Ahora sí, creemos la vista EliminarCuatrimestre:

Img. 2. Crear la vista EliminarCuatrimestre.

Modifiquemos el código de la vista:

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
	Eliminar Cuatrimestre
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

    <h2>Eliminar Cuatrimestre</h2>

    <h3>¿Está seguro de eliminar el cuatrimestre?</h3>
    <fieldset>
        <legend>Datos</legend>

        <div class="display-label"><strong>Id</strong>:</div>
        <div class="display-field"><%: Model.Id %></div>

        <div class="display-label"><strong>Programa educativo</strong>:</div>
        <div class="display-field"><%: Model.ProgramaEducativo.Nombre %></div>

        <div class="display-label"><strong>Inicio de periodo</strong>:</div>
        <div class="display-field"><%: Model.PeriodoInicio %></div>

        <div class="display-label"><strong>Fin de periodo</strong>:</div>
        <div class="display-field"><%: Model.PeriodoFin %></div>

        <div class="display-label"><strong>Año</strong>:</div>
        <div class="display-field"><%: Model.Anio %></div>

    </fieldset>
    <% using (Html.BeginForm()) { %>
        <p>
		    <input type="submit" value="Eliminar" /> |
		    <%: Html.ActionLink("Cancelar", "ProgramaEducativo", 
new { id = Model.IdPE })%>
        </p>
    <% } %>

</asp:Content>

En el caso que el cuatrimestre a eliminar ya tiene grupos, no puede eliminarse, para notificarlo al usuario lo haremos con otra vista, así que creemos una nueva vista llamada ErrorEliminar, la vista es tipada de la clase Cuatrimestre con contenido Empty.

Img. 3. Crear la vista ErrorEliminar.

El código para nuestra vista será:

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
	Eliminar cuatrimestre.
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

    <h2>No se puede eliminar el cuatrimestre.</h2>

    <p><b>El cuatrimestre que está intentando eliminar actualmente tiene 
grupos asignados.</b></p>
        <fieldset>
        <legend>Datos del cuatrimestre</legend>

        <div class="display-label"><strong>Id</strong>:</div>
        <div class="display-field"><%: Model.Id %></div>

        <div class="display-label"><strong>Programa educativo</strong>:</div>
        <div class="display-field"><%: Model.ProgramaEducativo.Nombre %></div>

        <div class="display-label"><strong>Grupos asociados</strong>:</div>
        <div class="display-field"><%: Model.Grupo.Count %></div>

        <div class="display-label"><strong>Inicio de periodo</strong>:</div>
        <div class="display-field"><%: Model.PeriodoInicio %></div>

        <div class="display-label"><strong>Fin de periodo</strong>:</div>
        <div class="display-field"><%: Model.PeriodoFin %></div>

        <div class="display-label"><strong>Año</strong>:</div>
        <div class="display-field"><%: Model.Anio %></div>

    </fieldset>

    <%: Html.ActionLink("OK, yá entendí", "ProgramaEducativo", 
new { id = Model.IdPE })%>

</asp:Content>

Confirmar la eliminación.

Como en el ejemplo de eliminar PE, ahora creemos la acción de confirmación para eliminar el cuatrimestre.

[HttpPost]
public ActionResult EliminarCuatrimestre(int id, string confirmar)
{
    //buscar el objeto en la BD
    var cuatrimestre = BD.Cuatrimestre.Where(c => c.Id == id).FirstOrDefault();

    //si el registro existe, eliminarlo
    if (cuatrimestre != null)
    {
        ViewData["IdPE"] = cuatrimestre.IdPE;
        BD.DeleteObject(cuatrimestre);
        BD.SaveChanges();
        return View("CuatrimestreEliminado");
    }
    else
        return View("Error");
}

Creemos la vista CuatrimestreEliminado.

Img. 4. Crear vista CuatrimestreEliminado.

Su código:

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
	Cuatrimestre Eliminado
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

    <h2>El cuatrimestre ha sido eliminado.</h2>
    <%: Html.ActionLink("Volver al programa educativo", "ProgramaEducativo", 
new { id = ViewData["IdPE"]  }) %>

</asp:Content>

Comprobando funcionalidad.

Ejecutando nuestra aplicación, ingresemos a los cuatrimestres del PE de prueba.

Img. 5. Intentar eliminar un cuatrimestre.

Si fuera el caso que el cuatrimestre tiene grupos asignados nos mostrará:

Img. 6. Cuando un cuatrimestre tiene grupos.

Pero cuando un cuatrimestre no tiene grupos:

Img. 7. Confirmar la eliminación del cuatrimestre.
Img. 8. Cuatrimestre eliminado.

Regresando al PE:

Img. 9. Cuatrimestres del PE.

Bien, pues hasta aquí terminamos la parte de los cuatrimestres, continuaremos con la gestión de grupos para cada cuatrimestre.

Anuncios

3 comentarios en “Aplicación web con ASP.NET MVC 2 – parte 6

  1. Tienes algún tutorial donde se pueda utilizar con mayor facilidad un DataGrid y otras herramientas con ASP.NET MVC 2, la verdad te lo agradeceríamos muchísimo.

    Hablando de concurrencia, que pasa si instalo esta aplicación y dos usuarios al mismo tiempo abren cada uno la vista para confirmar la eliminación de un mismo cuatrimestre, cuando ambos al mismo tiempo hagan clic, el que primero lo haga borrará exitósamente el cuatrimestre y el segundo que lo haga que sucederá, como evitar mensajes de errores?

  2. Tengo un error al crear la accion HistorialPE

    No se puede convertir implicitamente el tipo “int?” en “int”. Ya existe una conversión explicita (compruebe si le falta una conversión)…. que recae en: Anio = cuatrimestre.Anio
    Espero su ayuda…

    1. Pues simplemente haz la conversión explicita:
      Año = (int) cuatrimestre.Anio
      y eso es todo.
      Te recomiendo que leas un poco sobre conversión implícita y conversión explicita, así como boxing y unboxing.

Escribe tu comentario:

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s