0

não estou conseguindo verificar se pelo menos um checkbox foi marcado antes de dar submit no form.

Vi que tem algumas perguntas semelhantes a minha, mas nenhuma das soluções deram certo para mim

Usei o seguinte código e não está dando certo:

$("#funcoes_cursos").submit(function(){
            var cursos = $("#funcoes_cursos input[name='cursos[]']").val();
            if(cursos == "" || cursos === undefined){
                alert('Selecione um ou mais cursos para deletar');
                return false;
            }else {
                if( !(confirm("Ao deletar um curso, todos os dados relacionados a ele também serão deletados. Deseja realmente deletar o curso?")) ) {
                    return false;
                }
            }
        });

Os inputs estão no formato:

<input type="checkbox" name="cursos[]" value="">

A minha ideia é que antes de mandar o form para página que deleta os cursos selecionados, ele verifique se pelo menos um curso esteja selecionado. Mas do jeito que está ele não pega o valor do input.

1 Resposta 1

2

O problema é que $("#funcoes_cursos input[name='cursos[]']") devolve uma lista(array) de cursos e não um só, logo o .val() apanha apenas o valor do primeiro. Para além disso é necessário ver quais estão checked. A contabilização pode ser feita com o each(), passando em cada elemento e contando os que estão checked:

var cursos = $("#funcoes_cursos input[name='cursos[]']"); //apanhar todos

var checkados = 0; //iniciar a contagem
cursos.each(function() {
    if ($(this).is(':checked')) { //se está marcado conta mais 1
        checkados++; 
    }
});

Depois é apenas necessário verificar se a contagem é maior que 0. Integrando com o seu código ficaria assim:

$("#funcoes_cursos").submit(function() {
  var cursos = $("#funcoes_cursos input[name='cursos[]']");

  var checkados = 0;
  cursos.each(function() {
    if ($(this).is(':checked')) {
      checkados++;
    }
  });

  if (checkados == 0) {
    alert('Selecione um ou mais cursos para deletar');
    return false;
  } else {
    if (!(confirm("Ao deletar um curso, todos os dados relacionados a ele também serão deletados. Deseja realmente deletar o curso?"))) {
      return false;
    }
  }

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="funcoes_cursos">
  <input type="checkbox" name="cursos[]" value="curso1">
  <input type="checkbox" name="cursos[]" value="curso2">
  <input type="checkbox" name="cursos[]" value="curso3">

  <input type="submit">
</form>

Uma solução ainda mais simples é utilizar o pseudo seletor :checked diretamente na busca dos elementos. Isto vai fazer com que já so obtenha os elementos que estão checked e por isso resta apenas saber se obteve algum testando o length(quantidade) do que obteve.

Exemplo:

$("#funcoes_cursos").submit(function() {
  //agora buscar somente os checkeds, utilizando :checked no seletor
  var cursos = $("#funcoes_cursos input[name='cursos[]']:checked");
 
  if (cursos.length == 0) {
    alert('Selecione um ou mais cursos para deletar');
    return false;
  } else {
    if (!(confirm("Ao deletar um curso, todos os dados relacionados a ele também serão deletados. Deseja realmente deletar o curso?"))) {
      return false;
    }
  }

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="funcoes_cursos">
  <input type="checkbox" name="cursos[]" value="curso1">
  <input type="checkbox" name="cursos[]" value="curso2">
  <input type="checkbox" name="cursos[]" value="curso3">

  <input type="submit">
</form>

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 .