1

Boa tarde a todos! Tenho uma tabela com essas informações:

<tr>
   <td>Origem</td>
   <td>Destino</td>
   <td>Status</td>
</tr>
<tr class="status" data-status="<?php echo $linha['status'];?>">
   <td>SP</td>
   <td>MG</td>
   <td>C</td>
</tr>

No jquery, tenho um código que me retorna os valores assim:

(5) ["M", "C", "C", "C", "C"]

O que preciso é que quando o valor da coluna "status" for "M", a linha tenha uma cor e quando o valor da coluna "status" for "C", a linha tenha outra cor.

O meu código está assim, mas com esse código todas as linhas ficam com uma cor só.

var status = new Array();
        $('.status').each( function( i ){
            var $this = $( this )
            status[i] = $this.attr('data-status');
            if(status[i] == "M"){
                $('.status').addClass('livre');
            }else if(status[i] == "C"){
                $('.status').removeClass('livre').addClass('ocupado');
            }
        });
        console.log(status);

Alguém pode ajudar nesse caso?

Muito obrigado!

2 Respostas 2

0

Tem alguns problemas em seu código:

1º. Não use a palavra "status" para criar uma array. Essa palavra é reservada. Ao usá-la, sua array vai se comportar como uma string. Você pode adicionar um _ para diferenciá-la.

2º. No if você está chamando o elemento pela classe (ex., $('.status').addClass('livre');) e não pelo item do laço.

O correto seria:

var status_ = new Array('M','C','C','C','C');

$('.status').each( function( i,v ){
   var $this = $( this );
   status_[i] = $this.attr('data-status');
   if(status_[i] == "M"){
       $this.addClass('livre');
   }else if(status_[i] == "C"){
       $this.removeClass('livre').addClass('ocupado');
   }
});
.livre{
   background: yellow;
}

.ocupado{
   background: green;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
   <td>Origem</td>
   <td>Destino</td>
   <td>Status</td>
</tr>
<tr class="status" data-status="M">
   <td>SP</td>
   <td>MG</td>
   <td>C</td>
</tr>
<tr>
   <td>Origem</td>
   <td>Destino</td>
   <td>Status</td>
</tr>
<tr class="status" data-status="C">
   <td>SP</td>
   <td>MG</td>
   <td>C</td>
</tr>
<tr>
   <td>Origem</td>
   <td>Destino</td>
   <td>Status</td>
</tr>
<tr class="status" data-status="M">
   <td>SP</td>
   <td>MG</td>
   <td>C</td>
</tr>
</table>

0

Se a informação de status não for mudar você pode colocar direto na classe mesmo:

<tr class="status status-<?php echo $linha['status'];?>">

Aí no css você faz as regras para cada status:

.status-C td {color: red;}
.status-M td {color: green;}

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .