es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

  • es.davy.ai/
  • Programación /
  • Obtener el valor de renderización de una columna de datatable en lugar del valor de datos.

Obtener el valor de renderización de una columna de datatable en lugar del valor de datos.

02 Aug, 2023 Programación

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>
Tags:  , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para obtener los valores renderizados de la celda, debes utilizar el método cell().render() en la función initComplete. Aquí está el código actualizado:

    initComplete: function() {
  // seleccionar columna de estado
  dataTable.column(2).data().unique().sort().each(function(data, j) {
    var renderedData = dataTable.column(2).cell({ filter: 'applied', sort: 'current' }).render('display');
    if (renderedData === '1') {
      data = 'activo';
    } else if (renderedData === '0') {
      data = 'inactivo';
    }
    $('#filterByStatus').append('<option value="' + data + '">' + data + '</option>');
  });
}

    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étodo render() para obtener el valor renderizado de la celda ('display' como parámetro). Finalmente, comprobamos si el valor renderizado es 1 o 0 y actualizamos data en consecuencia antes de añadirlo al elemento select.

Comments are closed.