Checkbox in grid with ajax - how to send array

Question

Hello!

I’m assembling a feature where I need to send multiple chosen records in a grid by clicking on their checkbox... does anyone know how to save these chosen id’s and send via ajax/jquery to a php file that will perform another process?

code:

html:

<select class="btn_dGrid_btnActionWithSelecteds" name="btn_dGrid_btnActionWithSelecteds"> <option value="">A&ccedil;&atilde;o com os Selecionados</option> <option value="opt1">Opção1</option> </select>

jquery:

    $(".btn_dGrid_btnActionWithSelecteds").change(function(){
     var id_escolhido = $(".dynamicGridCheck").val();
   $.ajax({
                    url: "engine/php/gerar.php?&&id_escolhido="+id_escolhido,
success: function( data ){
   alert(data);
}
});

railing:

<tr>
   <td><input type="checkbox" value='$id'></td>
   <td>Registro1</td>
</tr>
<tr>
   <td><input type="checkbox" value='$id'></td>
   <td>Registro2</td>
</tr>

generate.php:

 $id_escolhido []= $_REQUEST['id_escolhido'];
foreach($id_escolhido as $ids){
        echo "id: ".$ids;
        echo "\n";
    }

...Currently only one record appears in php, but I select several...

Answer 1

Solved guys, follow the full code:

<meta charset="utf-8">

<style>
    table{
        display:block;
        border:1px solid #ccc;
    }
    table thead{
        display:block;
        border:1px solid #ccc;
    }
    table tbody{
        display:block;
    }
    table tbody tr{
        display:block;
        border:1px solid #ccc;
    }
    table td:first-child,
    table th:first-child{       
        min-width:50px;
    }
    table td,
    table th{
        text-align:left;
        min-width:100px;
    }   
</style>

<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.4.1.min.js"></script>

<form id="form1">

    <select name="btnGerar" class="btnGerar">
        <option value="">Ação com os selecionados</option>
        <option value="gerar">Gerar</option>
    </select>

    <br>
    <br>

    <table>
        <thead>
            <tr>
                <th></th>
                <th>Nome</th>
                <th>Endereço</th>
            </tr>
        </thead>

        <tbody>
            <tr>
                <td><input type="checkbox" name="gridCheck[]" value="1" class="gridCheck"></td>
                <td>John</td>
                <td>Rua Abc, 451</td>
            </tr>

            <tr>
                <td><input type="checkbox" name="gridCheck[]" value="2" class="gridCheck"></td>
                <td>Megg</td>
                <td>Rua xxx, 123</td>
            </tr>
        </tbody>
    </table>
</form>

<script>
$(document).ready(function(){

    $(".btnGerar").change(function(){

        var btnGerar = $(".btnGerar").val();    
        var gridCheck = $(".gridCheck").serialize();    

        if(btnGerar=="gerar"){                      

              var urlSet = "process/gridCheckProcess.php?gridCheck[]"+gridCheck;

              $.ajax({                          
                  url: urlSet,                
                  success: function(gridCheck){
                    alert(gridCheck);
                  },
                  error: function(){
                    alert('failure');
                  }
                });

        }else{
            //...   
        }//end if btnGerar

    });//end change 

});//end do
</script>

<?php

    $gridCheck = $_REQUEST['gridCheck'];
    //var_dump($gridCheck);

    foreach($gridCheck as $id){
        echo "id: ".$id;
        echo "\n";
    }   

?>