Está claro que Bootstrap ha calado hondo en los productos de la familia ASP.NET como marco de trabajo “oficial” para la maquetación de las páginas o vistas. Tanto es así, que incluso hay una característica introducida en la revisión 5.1 de MVC para facilitar el trabajo con el mismo, aunque siendo estrictos, puede beneficiar también al que opte por otro framework o incluso prefiera soluciones más artesanas.


Hasta MVC 5.0 inclusive, las sobrecargas de los helpers Html.EditorFor() y Html.Editor() que utilizábamos para generar editores de propiedades del modelo disponían de sobrecargas que permitían indicar, además de la propiedad en cuestión:

• El nombre de la plantilla (templateName) a utilizar, en la práctica, el nombre del archivo .cshtml ubicado en \Views\Shared\EditorTemplates que debía utilizarse como editor.
• El nombre del campo (fieldName), por si necesitábamos emplear en el editor un nombre específico, independientemente del indicado en la propiedad a editar.
• Datos adicionales (additionalViewData), que se introducían como datos de vista para la plantilla del editor, de forma que podíamos suministrarle información arbitraria desde este punto.

Pues bien, desde ASP.NET MVC 5.1 es posible enviar atributos HTML al editor empaquetándolos en la propiedad htmlAttributes del objeto de datos adicionales additionalViewData, por ejemplo de esta forma:

// View (.cshtml)
@Html.EditorFor(m=>m.UserName, new { 
    htmlAttributes = new { @class="col-md-2", title="Name", data_id="1234" }
})

// HTML result:
<input id="UserName" name="UserName" type="text" value=""
       class="col-md-2 text-box single-line" 
       title="Name"
       data-id="1234"    
/>

Como se puede observar en el ejemplo anterior, todas las propiedades incluidas en el objeto anónimo asignado a htmlAttributes son renderizadas tal cual en el cliente (bueno, salvo el ajuste de los atributos data-*), por lo que podemos enviar fácilmente clases o estilos de maquetación como las famosas clases col-* usadas por Bootstrap.

La verdad es que la solución que han elegido es algo verbosa, pero, pensándolo un poco, no había muchas más opciones que no supusieran la creación de nuevos helpers o romper código existente.

Publicado en Variable not found.