3

Estou trabalhando em um projeto em Rails, onde em uma view do projeto eu possuo vários comboBox, onde de inicio eu gostaria que apenas um estivesse habilitado, e de acordo com o valor selecionado os outros sejam liberados. Acho que seria interessante usar JavaScript ou/com jQuery para fazer isso, porem tenho pouco conhecimento em ambos. Alguém me indica como fazer ? Uma luz para que eu possa seguir ?

Segue código que tentei, porem não deu certo:

var update_field = function () {
    if ($(".card") == 'Spell') {
        $('.cardFamily').prop('disabled', false);
    } else {
        $('.cardFamily').prop('disabled', 'disabled');
    }
};

$(update_field);

2 Respostas 2

1

Antes de tudo no seuif ($(".card") == 'Spell') não está testando o valor de card, você deve buscar o valor, ou seja, if ($(".card").val() == 'Spell')


Então você quer que ao selecionar um comboBox outros fiquem disponíveis.

$("#familia").change(troca);

function troca(){
  
  $(".familia").prop( "disabled", true );//desabilita todas opcoes
  
  var objetoSelecionado = $(this).val();//busca o valor o campo selecionado
  $("."+objetoSelecionado).prop("disabled", false); // habilita somente a selecionada.
  
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="familia">
  <option value ="">Nenhum</option>
  <option value ="souza">Souza</option>
  <option value ="silva">Silva</option>
</select>

<select class="familia souza" disabled>
 <option value ="">vazio</option>
 <option value ="maria">Maria Souza</option>
 <option value ="mario">Mario Souza</option>
</select>

<select class="familia silva" disabled>
 <option value ="">vazio</option>
 <option value ="maria">Maria silva</option>
 <option value ="mario">Mario silva</option>
</select>

1

Para habilitar e desabilitar um select você pode usar os códigos abaixo respectivamente:

Com jQuery:

$('.cidades').prop("disabled", true);
$('.cidades').prop("disabled", false);

Com JavaScript:

var cells = document.getElementsByClassName("cidades");

for (var i = 0; i < cells.length; i++) {
    cells[i].disabled = true; //ou false;
}

Agora basta colocar os mesmo em suas verificações. Segue um exemplo no jsfiddle.

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 .