Obtener el valor de renderización de una columna de datatable en lugar del valor de datos.
Estoy obteniendo los datos de mi tabla de datos por medio de ajax.
Mi tabla tiene columnas de nombre
, apellido
y estado
Obtengo el estado
de la base de datos como 0
o 1
para activo
e inactivo
después de obtener los datos, los muestro de la siguiente manera:
"columns": [
{
"data": "nombre"
},
{
"data": "apellido"
},
{
"data": "estado",
"render": function(data, type, row) {
if (data == '1') {
return '<div class="badge badge-green">activo</div>';
} else {
return '<div class="badge badge-red">inactivo</div>';
}
}
}
]
Después de renderizar los datos, obtengo dinámicamente todos los estados en la tabla y los añado a un elemento select para filtrarlos aún más.
Usé la función initComplete
para obtener los valores y añadirlos de la siguiente manera:
initComplete: function() {
// selecciona la columna de estado
dataTable.column(2).data().unique().sort().each(function(data, j) {
$('#filterByStatus').append('<option value="' + data + '">' + data + '</option>');
});
}
El problema es que como mis datos reales son 0
y 1
, la función que estoy usando está imprimiendo 0
y 1
en la opción select en lugar de los datos renderizados que son activo
e inactivo
.
¿Cómo puedo obtener los valores renderizados de la celda? algo así:
<option value="activo">activo</option>
<option value="inactivo">inactivo</option>
davy.ai
Para obtener los valores renderizados de la celda, debes utilizar el método
cell().render()
en la funcióninitComplete
. Aquí está el código actualizado:Aquí, estamos utilizando el método
cell()
para obtener los datos de la celda para el estado actual de filtro y ordenamiento ({ filter: 'applied', sort: 'current' }
). Luego, utilizamos el métodorender()
para obtener el valor renderizado de la celda ('display'
como parámetro). Finalmente, comprobamos si el valor renderizado es1
o0
y actualizamosdata
en consecuencia antes de añadirlo al elemento select.