Descarga de la versión de prueba de Kendo UI para jQuery R2 2020 SP1
Kendo UI actualmente proporciona cuatro controles: Kendo UI para jQuery , Kendo UI para Angular , Kendo UI Support para React y Kendo UI Support para Vue . Kendo UI para jQuery es la biblioteca de UI más completa para crear aplicaciones web modernas.
Plantilla de fila
Kendo UI Grid admite plantillas de fila, lo que le permite colocar contenido personalizado en filas de Grid.
Para ver un ejemplo práctico, consulte:
- Demostración sobre el uso de la plantilla de fila de Grid
- Demostración sobre el uso de la plantilla de filas de detalles de la cuadrícula
- Demostración sobre el uso de la plantilla de la barra de herramientas de Grid
Si inicializa la cuadrícula desde un elemento div, puede formatear cualquier celda en la cuadrícula utilizando la plantilla en la etiqueta de secuencia de comandos o la plantilla en la opción de plantilla en el objeto de columna.
El siguiente ejemplo muestra cómo usar una plantilla para dar formato a una dirección de correo electrónico como un hipervínculo usando la plantilla declarada en el bloque de script.
<script id = "template" type = "text / x-kendo-tmpl"> <tr> <td> # = firstName # </td> <td> # = lastName # </td> <td> <a href = "mailto: # = email #"> # = email # </a> </td> </tr> </script>
El siguiente ejemplo muestra cómo especificar el método anterior como plantilla para cada fila pasándolo a la opción rowTemplate e inicializándolo con la función kendo.template. Como resultado, la dirección de correo electrónico es un hipervínculo interactivo y, cuando el usuario hace clic en ella, se abre un nuevo correo electrónico.
$ ("# grid"). kendoGrid ({
rowTemplate: kendo.template ($ ("# template"). html ()),
// Otra configuración.
});
Imagen: Cuadrícula con plantilla de fila aplicada