Skip to main content
adicionou 226 caracteres ao conteúdo
Fonte Link
Sam
  • 80,8mil
  • 22
  • 73
  • 128

Você está repetindo o id="seleciona", e com isso o JavaScript irá sempre buscar o primeiro que achar. Por isso o change só funciona no primeiro checkbox.

Um id deve ser único na página, não pode ser repetido.

Se você quer habilitar o input somente quando todos os checkboxesum número mínimo determinado forem marcados, basta comparar o total de checkboxes existentesesse número com a quantidade que foi marcada. Se forem iguaisa quantidade marcada for igual ou maior que o mínimo, habilita o input, se forem diferentesfor menor, desabilita.

O número mínimo a ser marcado você pode colocar num atributo data-* no input #cadastrar:

<input type="submit" data-min="2" id="cadastrar" value="Cadastrar" disabled>
                         ↑

Para fazer isso nem precisa de id's, basta selecionar os elementos pelo name, já que todos possuem o mesmo:

$(function(){

   $(":checkbox[name='seleciona[]']").on("change", function(){
      // selecionapega todoso osvalor checkboxesmínimo
      var totalminimo = $(":checkbox[name='seleciona[]']""#cadastrar").length;data("min");
      // conta quantos foram marcados
      var marcados = $(":checkbox[name='seleciona[]']:checked").length;
      
      $("#cadastrar").prop("disabled", totalmarcados ==>= marcadosminimo ? false : true );
      
   });

});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="submit" data-min="2" id="cadastrar" value="Cadastrar" disabled>
<br>
Marque todospelo osmenos 2 checkbox para habilitar o campo acima:
<br>
<input type="checkbox" name="seleciona[]" value="a" />
<input type="checkbox" name="seleciona[]" value="b" />
<input type="checkbox" name="seleciona[]" value="c" />

Você está repetindo o id="seleciona", e com isso o JavaScript irá sempre buscar o primeiro que achar. Por isso o change só funciona no primeiro checkbox.

Um id deve ser único na página, não pode ser repetido.

Se você quer habilitar o input somente quando todos os checkboxes forem marcados, basta comparar o total de checkboxes existentes com a quantidade que foi marcada. Se forem iguais, habilita o input, se forem diferentes, desabilita.

Para fazer isso nem precisa de id's, basta selecionar os elementos pelo name, já que todos possuem o mesmo:

$(function(){

   $(":checkbox[name='seleciona[]']").on("change", function(){
      // seleciona todos os checkboxes
      var total = $(":checkbox[name='seleciona[]']").length;
      // conta quantos foram marcados
      var marcados = $(":checkbox[name='seleciona[]']:checked").length;
      
      $("#cadastrar").prop("disabled", total == marcados ? false : true );
      
   });

});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="submit" id="cadastrar" value="Cadastrar" disabled>
<br>
Marque todos os checkbox para habilitar o campo acima:
<br>
<input type="checkbox" name="seleciona[]" value="a" />
<input type="checkbox" name="seleciona[]" value="b" />
<input type="checkbox" name="seleciona[]" value="c" />

Você está repetindo o id="seleciona", e com isso o JavaScript irá sempre buscar o primeiro que achar. Por isso o change só funciona no primeiro checkbox.

Um id deve ser único na página, não pode ser repetido.

Se você quer habilitar o input somente quando um número mínimo determinado forem marcados, basta comparar esse número com a quantidade que foi marcada. Se a quantidade marcada for igual ou maior que o mínimo, habilita o input, se for menor, desabilita.

O número mínimo a ser marcado você pode colocar num atributo data-* no input #cadastrar:

<input type="submit" data-min="2" id="cadastrar" value="Cadastrar" disabled>
                         ↑

Para fazer isso nem precisa de id's, basta selecionar os elementos pelo name, já que todos possuem o mesmo:

$(function(){

   $(":checkbox[name='seleciona[]']").on("change", function(){
      // pega o valor mínimo
      var minimo = $("#cadastrar").data("min");
      // conta quantos foram marcados
      var marcados = $(":checkbox[name='seleciona[]']:checked").length;
      
      $("#cadastrar").prop("disabled", marcados >= minimo ? false : true );
      
   });

});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="submit" data-min="2" id="cadastrar" value="Cadastrar" disabled>
<br>
Marque pelo menos 2 checkbox para habilitar o campo acima:
<br>
<input type="checkbox" name="seleciona[]" value="a" />
<input type="checkbox" name="seleciona[]" value="b" />
<input type="checkbox" name="seleciona[]" value="c" />

Fonte Link
Sam
  • 80,8mil
  • 22
  • 73
  • 128

Você está repetindo o id="seleciona", e com isso o JavaScript irá sempre buscar o primeiro que achar. Por isso o change só funciona no primeiro checkbox.

Um id deve ser único na página, não pode ser repetido.

Se você quer habilitar o input somente quando todos os checkboxes forem marcados, basta comparar o total de checkboxes existentes com a quantidade que foi marcada. Se forem iguais, habilita o input, se forem diferentes, desabilita.

Para fazer isso nem precisa de id's, basta selecionar os elementos pelo name, já que todos possuem o mesmo:

$(function(){

   $(":checkbox[name='seleciona[]']").on("change", function(){
      // seleciona todos os checkboxes
      var total = $(":checkbox[name='seleciona[]']").length;
      // conta quantos foram marcados
      var marcados = $(":checkbox[name='seleciona[]']:checked").length;
      
      $("#cadastrar").prop("disabled", total == marcados ? false : true );
      
   });

});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="submit" id="cadastrar" value="Cadastrar" disabled>
<br>
Marque todos os checkbox para habilitar o campo acima:
<br>
<input type="checkbox" name="seleciona[]" value="a" />
<input type="checkbox" name="seleciona[]" value="b" />
<input type="checkbox" name="seleciona[]" value="c" />