jueves, 29 de enero de 2015

Cadena de conexión (Connection String) Web.config (.NET – SQL SERVER)

Para conectarnos a base de datos necesitamos agregar la cadena de conexión en el web.config, y si estamos trabajando en un proyecto con múltiples entornos, es posible, que tengamos una base de datos de desarrollo, mantenimiento y producción.

En el siguiente ejemplo, tendremos tres (3) cadenas de conexión que agregaremos en el web.config: 


<connectionStrings>
    <add name="Desarrollo" connectionString="<Cadena-de-conexion>"/>
    <add name="Mantenimiento" connectionString="<Cadena-de-conexion>"/>
    <add name="Produccion" connectionString="<Cadena-de-conexion>"/>
</connectionStrings>

Ahora podemos ingresar cada uno de nuestras cadenas de conexión como un appSettings


<appSettings>
    <add key="EntornoDesarrollo" value="Desarrollo"/>
    <add key="EntornoMantenimiento" value="Mantenimiento"/>
    <add key="EntornoProducción" value="Producción"/>
</appSettings>
Y para obtener la cadena de conexión de la base de datos que deseemos: 


String entornoDesarrollo;
String entornoMantenimiento;
String entornoProducción;
String cadenaConexion;

//Entorno de desarrollo
entornoDesarrollo = ConfigurationManager.AppSettings["EntornoDesarrollo"];
cadenaConexion = ConfigurationManager.ConnectionStrings[entornoDesarrollo].ConnectionString;
//Entorno de mantenimiento
entornoMantenimiento = ConfigurationManager.AppSettings["EntornoMantenimiento"];
cadenaConexion = ConfigurationManager.ConnectionStrings[entornoMantenimiento].ConnectionString;
//Entorno de producción
entornoProducción = ConfigurationManager.AppSettings["EntornoProducción "];
cadenaConexion = ConfigurationManager.ConnectionStrings[entornoProducción].ConnectionString;

Etiquetas: , ,

entrada de AA+ @ enero 29, 2015  

martes, 20 de enero de 2015

Importar librerías - .NET MVC RAZOR

Para importar librerías en un proyecto de .NET MVC RAZOR, es muy recomendable utilizar Url.Content para resolver las rutas relativas.

A continuación el ejemplo:

Si queremos importar una librería de JQuery:
<script src="@Url.Content("~/Scripts/jquery-1.8.2.intellisense.js")"></script>

Si queremos importar un archivo css:
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" />

Así nos olvidamos de jugar con rutas relativas y mucho menos, de poner rutas absolutas.

Etiquetas: ,

entrada de AA+ @ enero 20, 2015  

_Layout.cshtml - .NET MVC RAZOR

Cuando empezamos un proyecto web en .NET MVC, y comenzamos a diseñar nuestras vistas debemos saber que es el _Layout.

De una manera sencilla, el _Layout es una página maestra (Padre) de la cual descienden todas las vistas (Hijos) que deseemos.

Si por ejemplo, queremos que el header y footer aparezcan en nuestras todas nuestras vistas, no es necesario copiar y pegar en cada una de ellas.  Para ello, declaramos nuestro header y footer en el _Layout y creamos nuestras vistas utilizando de página maestra al _Layout.

Por ejemplo:

<!DOCTYPE html>
<html lang="es">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta charset="utf-8" />
    <title>@ViewBag.Title - Mi aplicación ASP.NET MVC</title>
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <link href="//netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
    <meta name="viewport" content="width=device-width" />
</head>
<body>
    <div id="header">
        <h3>Mi aplicación .NET MVC</h3>
    </div>
    <div id="body">
        <div class="content-wrapper main-content clear-fix">
            @RenderBody()
        </div>
    </div>
    <div id="footer">
        <div class="content-wrapper">
            <div class="float-left">
                <p>&copy; @DateTime.Now.Year - Mi aplicación ASP.NET MVC</p>
            </div>
        </div>
    </div>
</body>
</html>


Como podemos ver, tenemos nuestro _Layout con el header, body y footer.

Ahora... En que parte del _Layout se hace referencia al contenido de nuestras vistas? En @RenderBody()

 Al cargar una vista por pantalla, el _Layout siempre tendrá fijo el header y el footer, mientras que el body irá cambiando según la vista que se muestre a través del @RenderBody()

Etiquetas: ,

entrada de AA+ @ enero 20, 2015  

Diferencias entre ViewBag y ViewData - .NET MVC RAZOR

Cuando nos iniciamos en .NET MVC , surge la primera duda... Pasar datos desde el controlador a la vista.

Para ello debemos conocer ViewData y ViewBag, que son "sacos" para pasar información entre el controlador y la vista.

Ahora veamos un ejemplo para el controlador "Index":

public ActionResult Index()
        {
            ViewBag.Mensaje= "Mi primer mensaje en MVC";
            ViewData["Mensaje"] = "Mi primer mensaje en MVC";


            return View();
        }

Ahora, tenemos dos opciones para pasar el mismo valor. Que utilizamos? ViewBag ó ViewData?

Aunque ambas tienen la misma funcionalidad, suelo utilizar el ViewBag por dos razones:

  1. El código queda más limpio y es más rápido de escribir, evitando corchetes [].
  2. El ViewData es de tipo Object y hay que hacer cast en la vista para utilizarlo, mientras que el ViewBag se genera dinámicamente con el tipo de dato asignado.
Ahora, para completar el ejemplo veamos la vista:

<p>@ViewBag.Mensaje</p>
<p>@ViewData["Mensaje"]</p>





Etiquetas: ,

entrada de AA+ @ enero 20, 2015  

lunes, 12 de enero de 2015

Traducir al español JQuery UI - Datepicker


En muchos casos agregamos el JQuery Datepicker a nuestros proyectos y no sabemos cómo traducir los textos al español.

Para empezar, debemos tener agregado a nuestro proyecto la librería de JQuery Datepicker (http://jqueryui.com/datepicker/)

En el código HTML debemos crear un campo de texto con la clase mi-fecha (Pueden poner el nombre que deseen a la clase):

<input class="mi-fecha" name="fecha" value="" />

En el código JAVASCRIPT:

//Código para realizar las traducciones:

$(document).ready(function () {
$.datepicker.regional['es'] = {
        closeText: 'Cerrar',
        prevText: '<Ant',
        nextText: 'Sig>',
        currentText: 'Hoy',
        monthNames: ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre'],
        monthNamesShort: ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun', 'Jul', 'Ago', 'Sep', 'Oct', 'Nov', 'Dic'],
        dayNames: ['Domingo', 'Lunes', 'Martes', 'Miércoles', 'Jueves', 'Viernes', 'Sábado'],
        dayNamesShort: ['Dom', 'Lun', 'Mar', 'Mié', 'Juv', 'Vie', 'Sáb'],
        dayNamesMin: ['Do', 'Lu', 'Ma', 'Mi', 'Ju', 'Vi', 'Sá'],
        weekHeader: 'Sm',
        dateFormat: 'dd/mm/yy',
        firstDay: 1,
        isRTL: false,
        showMonthAfterYear: false,
        yearSuffix: ''
    };
    $.datepicker.setDefaults($.datepicker.regional['es']);


//Código para indicar que la clase mi-fecha es un datepicker:

$(".mi-fecha").datepicker();
});


Con el ejemplo, obtendremos el calendario traducido al español.

Etiquetas:

entrada de AA+ @ enero 12, 2015