martes, 8 de marzo de 2016

NCapas Ntier EntityFrameWork 3

NCapas Ntier EntityFrameWork 

Capa de Presentacion

Para terminar esta presentacion, no estoy muy acostumbrado a usar Razor o por lo menos usarlo poco como ejm el layout y algunas cosillas simples,la idea es tratar de tener una aplicacion que responda a peticiones AJAX asi que en este ejm creare funciones basicas que devolveran Obj Json a traves de DTO's(Create Data Transfer Objects).

Creando el Layout

Este layout nos permite tener siempre cargados los archivos JS al final de nuestros HTML y no tener problemas de falta de un js no cargado, para ello usamos IsSectionDefined el cual nos permite si esta creado esa seccion agregarle algo en este caso el JS.


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title - Demo Test</title>
    <link href="~/Assest/css/web.css" rel="stylesheet" type="text/css" />
    <link href="~/Assest/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <script src="~/Assest/js/modernizr-2.6.2.js"></script>
</head>
<body>
    <div class="navbar navbar-inverse navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                @Html.ActionLink("Demo Application", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })
            </div>
            <div class="navbar-collapse collapse">
                <ul class="nav navbar-nav">
                </ul>
            </div>
        </div>
    </div>

    <div class="container body-content">
        @RenderBody()
        <hr />
        <footer>
            <p>&copy; @DateTime.Now.Year - My ASP.NET Application</p>
        </footer>
    </div>

    <script src="~/Assest/js/jquery-1.10.2.min.js"></script>
<script src="~/Assest/js/bootstrap.min.js"></script>
    @if (IsSectionDefined("jsFiles"))
    {
        @RenderSection("jsFiles");
    }

</body>
</html>

Ejemplo usando una seccion al final del html dentro del view HOME


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
@{
    ViewBag.Title = "Home";
}

<h2>Usuario</h2>
<a href="~/home/editar">Nuevo Registro</a>
</br>
<table class="table table-striped">
    <thead>
        <tr>
            <td>Nombre</td>
            <td>Apellido</td>
        </tr>

    </thead>
    <tbody>
        @foreach (var usuario in Model)
        {
            <tr>
                <td>@usuario.Nombre</td>
                <td>@usuario.Apellido</td>
            </tr>
        }
    </tbody>
</table>
<div class="form-horizontal">
    <div class="form-group">
        <label class="control-label">Nombre</label>
        <input type="text" class="form-control" />
    </div>

    <div class="form-group">
        <label class="control-label">Apellido</label>
        <input type="text" class="form-control" />
    </div>
</div>
<div>
    <input id="btnReolad" type="button" class="btn btn-success" value="Cargar"/>
    <input type="button" class="btn btn-danger" value="Cancelar"/>
</div>

@section jsFiles
{
    <script type="text/javascript">
        $(function() {

            function loadEditUsuario() {
                $.ajax({
                    type: "POST",
                    url: "EditarJson",
                    data: {
                        "Nombre": "A1",
                        "Apellido": "A2",
                        "Id": 11
                    },
                    dataType: "Json",
                    success: function() {
                        console.log("exuito");
                    },
                    error: function() {
                        alert("Error");
                    },
                    complete: function() {
                        alert("complete");
                    }

                });
            }

            $("#btnReolad").click(
                function(event) {
                    loadEditUsuario();
                });
        })
    </script>
}

Controller HOME

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using BL.BlImp;
using Entity;

namespace WebAppEF.Controllers
{
    public class HomeController : Controller
    {
        private RolImpl rolImpl = new RolImpl();
        private UsuarioImp usuarioImp = new UsuarioImp();
        public ActionResult Index()
        {
            return View((List<Usuario>)usuarioImp.GetAll());
        }

        public ActionResult Editar(int idUsuario = 0)
        {
            ViewBag.Roles = rolImpl.GetAll();
            return View(idUsuario == 0 ? new Usuario() : usuarioImp.Find(x => x.id == idUsuario));
        }


        [HttpPost]
        public JsonResult EditarJson(Usuario usuario)
        {
            string message = "Success";
            return Json(message, JsonRequestBehavior.AllowGet);
        }


        [HttpPost]
        public JsonResult GetUsuariosJson(Usuario usuario)
        {
            var message= rolImpl.GetAll();
            return Json(message, JsonRequestBehavior.AllowGet);
        }
    }
}
Antes de crear la parte de la Capa de presentacion me cree un proyecto de Test el cual siempre es util cuando quieres probar un metodo nuevo  y poder testearlo, no esta de mas hacer algo de TDD. 

El proyecto completo lo podras obtener del siguiente enlace  Descarga





Publicado por en

No hay comentarios:

Publicar un comentario

Suscribirse a: Enviar comentarios (Atom)