1

Como faço para alterar a cor do label do meu botão dependendo do valor que ele tem?

No meu formulário, no campo status, preciso que quando o valor estiver em "aberto", fique verde, quando "concluído" fique em azul, e quando "cancelado" em vermelho.

Fiz uma função utilizando o Thymeleaf mais ainda nao está correto.

Resultado visual da função

Obtive o resultado fazendo assim:

<span class="badge badge-success"
      th:text="${f.status.descricao}"
      th:classappend="${#strings.toString(f.status) == 'ABERTO' ? 'label-success' : 'badge-danger'}">
</span>

Dessa forma ele fica em verde quando está em status em aberto, porém os demais valores (cancelado, concluído) são aplicados pela cor vermelha, referente à classe badge-danger, isso porque não sei como avaliar as outras duas opções dentro da função.

2
  • Penso que este site ira te exclarecer a dúvida.... w3schools.com/bootstrap4/bootstrap_colors.asp Commented 8/12/2018 às 20:12
  • Isso serviu como uma luva para min ermão! Muito obrigado, comecei a mexer com thymeleaf e bootstrap a pouco tempo, entao me perdi com a condição. Mais isso foi exatamente o que precisava!! Commented 10/12/2018 às 0:49

1 Resposta 1

1

Você pode incluir um outro ternário entre parênteses após o : do ternário atual.

Em vez de:

th:classappend="${#strings.toString(f.status) == 'ABERTO' ? 'label-success' : 'badge-danger'}"

Ficará:

th:classappend="${#strings.toString(f.status) == 'ABERTO' ?
'label-success' :
(#strings.toString(f.status) == 'CONCLUIDO' ? 'label-concluido' : 'badge-danger')}"

A classe label-concluido é apenas um exemplo. Coloque a classe que você quer que se refere ao estado "CONCLUIDO".

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 .