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' 'admin@gmail.com' '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 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
    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 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 el 20 mar. 2017 a las 2:24
  • 1
    correcto, asi es.
    – JG_GJ
    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
    el 23 mar. 2017 a las 6:14
  • resuelto, muchisimas gracias.
    – JG_GJ
    el 23 mar. 2017 a las 6:38

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

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