0

De esta manera muestro los registros en la tabla, utilizo angular-datatable.js.

Ejemplo de como muestra la informacion la tabla:

'ID' 'USUARIO' 'NOMBRE 'EMAIL' 'TELEFONO' 'ESTADO' 'CREADO' 'ACCIONES'


'1' 'admin' 'Administrador' '[email protected]' '54203090' '1' '2017-02-13 18:34:01' 'BOTONES'


De esta manera me muestra los registros pero si notan en el campo estado devuelve un "1", necesito mediante HTML mostrar el texto "Activo" si es igual a "1" o inactivo si es igual a "2.

aca un ejemplo de como lleno toda la tabla.

var vm = this;
            vm.dt_data = [];               
            vm.item = {};
            vm.edit = edit;
            vm.dtOptions = DTOptionsBuilder.newOptions()
                .withOption('initComplete', function() {
                    $timeout(function() {
                        $compile($('.dt-uikit .md-input'))($scope);
                    })
                })
                .withPaginationType('full_numbers')
                .withOption('createdRow', function (row, data, dataIndex) {
                    $compile(angular.element(row).contents())($scope);
                })
                .withOption('ajax', {
                    dataSrc: function(json) {
                        json['draw']=1
                        json['recordsFiltered'] = json.records.length                            
                        json['recordsTotal'] =json.records.length
                        console.log(json.records)
                        return json.records;
                      },
                    url: 'http://localhost:808/sistemaerp/public/ws/usuarios',
                    type: 'GET',
                })
                //.withDataProp('records')
                .withOption('processing', true)
                .withOption('responsive', true);

            vm.dtColumns = [
              DTColumnBuilder.newColumn('id').withTitle('Id'),
              DTColumnBuilder.newColumn('usuario').withTitle('Usuario'),
              DTColumnBuilder.newColumn('nombre').withTitle('Nombre'),
              DTColumnBuilder.newColumn('email').withTitle('Email'),
              DTColumnBuilder.newColumn('telefono').withTitle('Telefono'),
              DTColumnBuilder.newColumn('estado').withTitle('Estado'),
              DTColumnBuilder.newColumn('created_at').withTitle('Creado'),
              DTColumnBuilder.newColumn(null).withTitle('Acciones').notSortable().renderWith(function(data,type,full){
              vm.item[data.id] = data; 
              return  ' <a href="#" data-uk-modal="{target:\'#modal_header_footer\'}" ng-click="showCase.edit(showCase.item[' + data.id + '])">'+
                      ' <i class="md-icon material-icons md-bg-light-blue-900 uk-text-contrast"></i></a>'+
                      ' <a href="#" data-uk-modal="{target:\'#modal_header_footer_eliminar\'}" ng-click="showCase.edit(showCase.item[' + data.id + '])">'+
                      ' <i class="md-icon material-icons md-bg-red-900 uk-text-contrast">&#xE872;</i></a>';
              })                    
          ]; 

Estos son todos los campos que muestra la tabla, la data la recibo de url: 'http://localhost:808/sistemaerp/public/ws/usuarios',

        vm.dtColumns = [
          DTColumnBuilder.newColumn('id').withTitle('Id'),
          DTColumnBuilder.newColumn('usuario').withTitle('Usuario'),
          DTColumnBuilder.newColumn('nombre').withTitle('Nombre'),
          DTColumnBuilder.newColumn('email').withTitle('Email'),
          DTColumnBuilder.newColumn('telefono').withTitle('Telefono'),
          DTColumnBuilder.newColumn('estado').withTitle('Estado'),
          DTColumnBuilder.newColumn('created_at').withTitle('Creado'),
          DTColumnBuilder.newColumn(null).withTitle('Acciones').notSortable().renderWith(function(data,type,full){
          vm.item[data.id] = data; 
          return  ' <a href="#" data-uk-modal="{target:\'#modal_header_footer\'}" ng-click="showCase.edit(showCase.item[' + data.id + '])">'+
                  ' <i class="md-icon material-icons md-bg-light-blue-900 uk-text-contrast"></i></a>'+
                  ' <a href="#" data-uk-modal="{target:\'#modal_header_footer_eliminar\'}" ng-click="showCase.edit(showCase.item[' + data.id + '])">'+
                  ' <i class="md-icon material-icons md-bg-red-900 uk-text-contrast">&#xE872;</i></a>';
          }) 

en este campo "estado" DTColumnBuilder.newColumn('estado').withTitle('Estado'), en la tabla muestra ya sea un 1 o un 2 por lo tanto debo decir que si es un "1" muestre el texto "activo", y si viene un 2 "inactivo". El texto debe ser mostrado cib este estilo <span class="uk-badge uk-badge-success">Activo</span>

6
  • Bueno, veo que no expones como tal un código, y dices que quieres que dependiendo el código 1 o el 2 se active o inactive algo, podrías explicar mas el código y poner un poco mas de enunciado Commented el 20 mar. 2017 a las 1:47
  • No es de activar o desactivar algo. En la tabal debe mostrar el texto "Activo" o "Inactivo" ya que solo muestro un "1" o "2". Espero y me ayudes, gracias.
    – JG_GJ
    Commented el 20 mar. 2017 a las 1:59
  • te recomiendo poner en la parte superior, como un contexto de lo que esta pasando, si no muestra nada, si muestra la información incorrecta, lo que quieres lograr, y de que manera Commented el 20 mar. 2017 a las 2:07
  • a ver si logro entender, quieres que en vez de 1 o 2, aparezca, activo o inactivo Commented el 20 mar. 2017 a las 2:24
  • 1
    correcto, asi es.
    – JG_GJ
    Commented el 20 mar. 2017 a las 3:04

1 respuesta 1

1

Puedes intentar aplicarle un filtro a tu template:

app.filter('statusFilter', [function () {
    return function (item) {
        var filteredValue = item === '1' ? 'Activo' : 'Inactivo';
        return filteredValue;
    };
}]);

Y después aplicarlos a tu tabla.

 DTColumnBuilder.newColumn('estado').withTitle('Estado').renderWith(function(data){
   return  '<span class="uk-badge uk-badge-success">' + $filter('statusFilter', data.estado) + '</span>';
 });

O bien evaluando ahí mismo el valor de data.estado

DTColumnBuilder.newColumn('estado').withTitle('Estado').renderWith(function(data){
  var filteredValue = data.estado === '1' ? 'Activo' : 'Inactivo';
  return  '<span class="uk-badge uk-badge-success">' + filteredValue + '</span>';
});
2
  • Muchas Gracias, me ha servido. Solo no entiendo porque me muestra "Inactivo" cuando data.estado === '1'. Cuando deberia ser 'Activo'. Que estare haciendo mal :/
    – JG_GJ
    Commented el 23 mar. 2017 a las 6:14
  • resuelto, muchisimas gracias.
    – JG_GJ
    Commented el 23 mar. 2017 a las 6:38

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.