0

tengo un datatable que lleno mediante ajax, una de las columnas recibe un valor int (0, 1, 2) pero necesito que en lugar que en la tabla se muestre 0,1 me muestre un texto que diga Activo, inactivo o en proceso...

Buscando encontre que debia utilizar esta linea en el ajax:

{data: 'status' , render: function (data, type, row) { return data ?  '<h6><span class="badge badge-danger">inactivo</span></h6>' : '<h6><span class="badge badge-success">Activo</span></h6>'; }},

pero no me funciona

Alguna idea de como hacer lo comentado?

El script es asi:

<script>
    $(document).ready(function(){
        $('#servicios').DataTable({
         destroy: true,
        "ajax": "{{route('admin.servicios.solicitudes.data')}}",
        "columns":[
            {data: 'id'},
            {data: 'fecha_solicitud'},
            {data: 'status' },

            {data: 'accions'}
        ],
        "language": {
            "lengthMenu": "Mostrar _MENU_ registros por pagina",
            "zeroRecords": "No hay Registros por mostrar",
            "info": "Mostrando pagina _PAGE_ de _PAGES_",
            "infoEmpty": "No records available",
            "infoFiltered": "(Filtrado de _MAX_ registros totales)",
            "search": "Buscar:",
            "paginate":{
            "next": "Siguiente",
            "previous" : "Anterior"
            },
         }
        });
    });
</script>

y mi tabla html:

 <table class="table table-striper" id="servicios">
            <thead>
                <tr>
                    <th>ID</th>
                    <th>Fecha de Solicitud</th>
                    <th>Status</th>

                    <th>&nbsp;</th>
                </tr>
            </thead>
          </table>

Saludos a todos

1
  • Puedes modificar la lo que retorna la petición Ajax?
    – MR Dev
    el 23 jun. 2021 a las 14:27

1 respuesta 1

0

Sería más fácil ayudar si precisaras qué es exactamente lo que no funciona cuando usas la opción render de columns, pero resulta evidente que:

{
  data: 'status' , 
  render: function (data, type, row) { 
     return data 
     ? '<h6><span class="badge badge-danger">inactivo</span></h6>' 
     : '<h6><span class="badge badge-success">Activo</span></h6>'; 
  }
}

Tiene como consecuencia que un cero se mapea a Activo y cualquier otro status, a Inactivo, lo cual es incorrecto cuando un estado se debiese mapear a pendiente. Además, si el status 0 viene como string, en realidad todo estará inactivo.

Puedes probar con un switch y casteando el status a número, con

 data: 'status',
 render: function(data, type, row) {
    let status, className;
    switch (Number(data)) {
        case 1:
          status    = 'Inactivo';
          className = 'danger';
         break;

        case 2:
          status    = 'Pendiente';
          className = 'warning';
         break;

        default;
          status    = 'Activo';
          className = 'success';
         break;
    }

    return `<h6>
            <span class="badge badge-${className}">${status}</span>
            </h6>`;
 }

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.