Get value from all checkboxes marked

Question

How do I take all checkbox values that are checked and move to GET.

$("#subcategoria").click(function(){

            var checados = [];
            $.each($("input[name='subcategoria[]']:checked"), function(){

                $.get("inc_habilidades.php",
                    {id:checados.push($(this).val()),  opcao:'2'},
                    function(valor2){
                        $("#habilidades").html(valor2).chosen("destroy");
                    }
                )
            });

        })

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<form action="" method="">
    <input class="subcategoria" type="checkbox" name="subcategoria[]" value="1" />teste1<br>
    <input class="subcategoria" type="checkbox" name="subcategoria[]" value="2" />teste2<br>
    <input class="subcategoria" type="checkbox" name="subcategoria[]" value="3" />teste3<br>
    <input class="subcategoria" type="checkbox" name="subcategoria[]" value="4" />teste4
</form>

Answer 1

Instead of id working with classes

    $(document).ready(function() {
        $(".teste").click(function(e) {
            var checados = [];
            $.each($("input[name='teste[]']:checked"), function(){            
                checados.push($(this).val());
            });
            console.log(checados.join(", "));
        });
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="" method="">
    <input type="checkbox" name="teste[]" class="teste" value="teste1" />teste1<br>
    <input type="checkbox" name="teste[]" class="teste" value="teste2" />teste2<br>
    <input type="checkbox" name="teste[]" class="teste" value="teste3" />teste3<br>
    <input type="checkbox" name="teste[]" class="teste" value="teste4" />teste4<br>
</form>

The ids are a way of identifying an element, and should be UNIQUE for each element. id - Mozilla Developer

• The method push is used to add one or more items in the array. push - Mozilla Developer

The question has been edited and the way it is now I don’t see why to use jquery when you can do what you want with b a ba. See below:

HTML

<form id="myForm" action="" method="post">
    <input type="checkbox" name="teste[]" value="teste1" />teste1<br>
    <input type="checkbox" name="teste[]" value="teste2" />teste2<br>
    <input type="checkbox" name="teste[]" value="teste3" />teste3<br>
    <input type="checkbox" name="teste[]" value="teste4" />teste4<br>
    <input type="hidden" name="opcao" value="2" />
    <input type="submit" value="Enviar">
</form>

PHP

$opcao = $_POST["opcao"]; // 2

$id = implode( ",", $_POST['teste'] ); // com os 4 marcados,  teste1,teste2,teste3,teste4

Answer 2

You should assign a different id for each element. An id should be unique on a page:

<form action="" method="">
    <input type="checkbox" name="teste[]" id="teste1" value="teste1" />teste1<br>
    <input type="checkbox" name="teste[]" id="teste2" value="teste2" />teste2<br>
    <input type="checkbox" name="teste[]" id="teste3" value="teste3" />teste3<br>
    <input type="checkbox" name="teste[]" id="teste4" value="teste4" />teste4
</form>
<script>

$(document).ready(function(e) {
  $("input").click(function(e) {
      alert($(this).val());
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<form action="" method="">
    <input type="checkbox" name="teste[]" id="teste1" value="teste1" />teste1<br>
    <input type="checkbox" name="teste[]" id="teste2" value="teste2" />teste2<br>
    <input type="checkbox" name="teste[]" id="teste3" value="teste3" />teste3<br>
    <input type="checkbox" name="teste[]" id="teste4" value="teste4" />teste4
</form>

ANOTHER ANSWER:

Change the script to:

var checados = [];
$(".subcategoria").click(function(){
    $(this).each(function(){
        if(this.checked){
            $.get("inc_habilidades.php",
                {id:checados.push(this.value),  opcao:'2'},
                function(valor2){
                    $("#habilidades").html(valor2).chosen("destroy");
                }
            )
        }else{
            checados.splice(checados.indexOf(this.value),1);
        }
    });
});

Answer 3

For:

<script>                                                                    
       var checkbox = document.getElementsByName('teste[]');          
       for($i=0; $i<$checkbox ; $i++){                       
          checkbox[i].val();                                                  
       }                                                              
</script>