Cita

Próxima entrada

La próxima entrada ira dedicada al patrón Promise de Java Script, ya que considero que es uno de los pilares de toda la nueva filosofía de desarrollo para las windows App Store y desarrollo web.

Anuncios

Html Helpers ( Encapsulación )

Voy a comenzar esta entrada explicando un poco el concepto de los Helpers en ASP.NET MVC.

Los Helpers son simplemente bloques de código encapsulados para facilitar la creación y configuración de controles. Estos nos aportan también la posibilidad de la reutilización en cualquiera de nuestras vistas.

Razor, nos ofrece unos cuantos Helpers muy interesantes y que nos facilitan mucho la creación de controles típicos, pero hoy no nos centraremos en los ya definidos por Razor sino, en la creación de Helpers personalizados.

Veamos cómo crear uno:

“Antes de nada comentar que vamos a crear nuestro helper de forma global para que sea accesible desde cualquier vista, de esta forma damos mucho más sentido al principio de reutilización de estas clases.”

En el siguiente ejemplo vamos a crear un Helper para listar nuestros productos, de tal manera que en cualquier página que necesitemos realizar un listado de productos únicamente tendremos que consumirlo y tendremos como respuesta una lista ya maquetada.

@helper ListadoProductos(List<Product> Productos) {

<ul id=”LPruductos”>

@foreach( var itm in Productos) {

<li>@itm.Nombre ($@itm.Precio)</li>

}

</ul>

}

Este código lo vamos a realizar en un archivo con extensión .cshtml lo llamaremos Helpers.cshtml y lo vamos a guardar en la carpeta App_Code de nuestro proyecto, de esta
manera lo vamos a globalizar .

captura1

De esta manera, cuando queramos utilizar nuestro helper únicamente deberemos llamar a nuestros métodos de la siguiente manera.

<div>

<p>Listado de nuestros productos</p>

@Helpers.ListadoProductos(Model.Productos)

</div>

Conclusión 

Bueno, hemos visto como crear un helper aprovechando la sintaxis que nos proporciona Razor y podemos ver lo interesante que nos puede resultar para realizar lógicas globales y reutilizables .

Espero que os haya parecido interesante y de ayuda.

Ciao!

selectores básicos en JQuery

Quiero hacer mi primera entrada hablando sobre uno de los puntos más básicos de JQuery pero a su vez , uno de los más potentes ya que gracias al manejo de los selectors puedes acceder a cualquier tipo de entidad de una página.

Podríamos diferenciar los selectors entre básicos y avanzados , ya que se pueden hacer unas especies de expresiones que sean el resultante de lo que estas buscando, pero este punto lo dejaremos para una próxima entrada, sin mas dilación entremos de lleno en el tema.

Selectors básicos:

Id del elemento: para acceder a un elemento del documento mediante su identificador , únicamente nos es necesario utilizar el símbolo “#”  , por lo tanto sería algo así:

  • $(“#MyLabel”).val();

Tag del elemento: para acceder a un elemento por su tag, directamente debemos indicar el elemento al que accedemos sin símbolos.

  • $(“a”).css(“fontFamily”,”Arial”);

Css del elemento: para acceder a un elemento por su css simplemente utilizamos el símbolo “.”

  • $(“.resultado”).css(“color”,”red”);

Acceder a todos los elementos: también podemos acceder a la totalidad de elementos del documento, para ello utilizaremos “*”

  • $(“*”).css(“color”,”black”);

En la próxima entrada explicare un poco los selectores avanzados , que seria básicamente la combinación o customización de los expresados en esta .

 

Ciao!