Tag Helpers

Los tag helpers son etiquetas de servidor que se escriben como HTML en las vistas Razor y el motor expande a marcado real. Crono aporta un conjunto propio (barras de pestañas, zonas, modales, controles de formulario, imágenes de medios, etc.) que encapsulan patrones repetidos del backend y el frontend.

Registro en _ViewImports.cshtml

Los tag helpers se habilitan con @addTagHelper. Los temas y vistas de Crono los registran desde su _ViewImports.cshtml:

@inherits Crono.Web.Razor.CronoPaginaRazor<TModel>

@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@addTagHelper Crono.Web.EtiquetaAyudantes.Compartido.*, Crono.Web.Comun
@addTagHelper Crono.Web.EtiquetaAyudantes.Publico.*, Crono.Web.Comun

Los tres espacios de nombres de tag helpers de Crono son:

Espacio de nombres	Ámbito
Crono.Web.EtiquetaAyudantes.Compartido.*	Backend y frontend.
Crono.Web.EtiquetaAyudantes.Publico.*	Frontend (público).
Crono.Web.EtiquetaAyudantes.Admin.*	Backend (administración).

Pestañas

Barra de pestañas con contenido por pestaña:

<barrapestanias id="config" cr-estilo-navegacion="Material" cr-posicion-navegacion="Arriba">
    <pestania cr-titulo="@T("Comun.General")" cr-seleccionado="true">
        @* contenido *@
    </pestania>
    <pestania cr-titulo="Conexión" cr-visible="Model.MostrarConexion">
        @* contenido *@
    </pestania>
</barrapestanias>

<barrapestanias> admite atributos como cr-estilo-navegacion, cr-posicion-navegacion, cr-responsivo y cr-oculta-unico-elemento. Cada <pestania> (hija de barrapestanias) usa cr-titulo, cr-nombre, cr-seleccionado, cr-visible y cr-deshabilitado.

Zonas y micro‑aplicaciones

Definir un punto de inyección con <zona> y aportar contenido con <microaplicacion> (ver Widgets):

<zona nombre="admin_dashboard_despues"></zona>

<microaplicacion zona-destino="admin_boton_barraherramienta_antes" orden="10">
    <button class="btn btn-primary">Emitir</button>
</microaplicacion>

<zona> acepta nombre, modelo, reemplaza-contenido y elimina-si-vacio. <microaplicacion> acepta zona-destino, orden, anteponer y clave; también existe la variante sobre <script zona-destino="..."> para inyectar scripts en una zona.

Modales y menús

<modal id="confirmar" cr-tamanio="Mediano" cr-mostrar="false">
    <modal-encabezado>...</modal-encabezado>
    <modal-cuerpo>...</modal-cuerpo>
    <modal-piepagina>...</modal-piepagina>
</modal>

<menu nombre="lateral" plantilla="AdminMenu" />

Renderizado condicional

Suprimir o mostrar cualquier elemento según una condición con el atributo cr-si, sin @if alrededor:

<div cr-si="Model.EsAdministrador">Solo para administradores</div>

También hay <suprimir-si-vacio> y su variante para zonas vacías, útiles para no renderizar contenedores sin contenido.

Formularios y medios

Los controles de formulario (FormularioControl, Editor, NumeroEntrada, ColorCaja, EntradaClave, FormularioAjax) envuelven input/select con asp-for para aplicar estilos, validación y localización automáticamente. Para medios, <imagen cr-archivo-id="..."> (e <imagen cr-archivo="...">) renderiza imágenes del sistema de medios con versionado y miniaturas (ver Medios).

Grilla de datos

El backend usa un conjunto de tag helpers para las grillas (<grilla>, columnas, filtrado, ordenamiento, paginación, panel de búsqueda, barra de herramientas y vista de detalle), que conectan la tabla con un origen de datos paginado del servidor. Es el patrón estándar de los listados del administrador.

tip

Prefiere los tag helpers de Crono a construir el HTML a mano: garantizan estilos, accesibilidad, localización y comportamiento (AJAX, validación) coherentes en todo el sistema.