How can I insert data from checkboxes created with a while into a database through an ajax function?

Question

How can I insert data from checkboxes created with a while into a database through an ajax function?

Navigation

#1 by (0 votes)

0

This is my checkbox

<div class="col-sm-4 text-left" id="checktiptrab">
    <?php
        while ($rowb=mysqli_fetch_array($querytipotrabajo)){
            echo '
            <label class="btn btn-primary">
                <input value= "'.$rowb['codigotipotrabajo'].'" type="checkbox" name="CheckTipoTrabajo" id="CheckTipoTrabajo">
                '.$rowb['descripciontipotrabajo'].'   
            </label>
            <br>
            <br>';
        }
    ?>
</div>

I take the value in my ajax:

var CheckTipoTrabajo=document.getElementById('CheckTipoTrabajo').value;

html php ajax

asked by Jorge_a_b_s 18.12.2017 в 23:37

source

1 answer

Error showing data from an array of VueJS objects Inheritance in controller.php Laravel 5.5

score 0 · Answer 1

If you are going to send the data to the server via AJAX then you can leave your HTML structure as it is, since the data would be captured with > JavaScript , a array would be formed and sent to Back-End .

The only thing I would advise you is to change the id of the ckeckbox by class , remember that the id is a unique identifier and unrepeatable on the site so if 2 or more elements are going to share the same name is necessary to change the id by class .

<div class="col-sm-4 text-left" id="checktiptrab">
    <?php
        while ($rowb = mysqli_fetch_array($querytipotrabajo)){
            echo '
            <label class="btn btn-primary">
                <input value= "'.$rowb['codigotipotrabajo'].'" type="checkbox" name="CheckTipoTrabajo" class="CheckTipoTrabajo">
                '.$rowb['descripciontipotrabajo'].'   
            </label>
            <br>
            <br>';
        }
    ?>
</div>

I leave a functional example of how you should capture the values of checkbox that have been selected, the example is only in JavaScript using the library jQuery to simulate the operation, if you look carefully the checkbox are generated by means of a cycle for to simulate as much as possible the cycle while of your PHP .

for(var i = 1; i <= 10; i++){
    $("#checktiptrab").append('<label class="btn btn-primary"><input value="codigotipotrabajo_'+ i +'" type="checkbox" name="CheckTipoTrabajo" class="CheckTipoTrabajo">Descripcion tipo trabajo '+ i +'</label><br><br>');
}

$("#enviar").click(function(){
    var datos = Array();

    $('[name="CheckTipoTrabajo"]:checked').each(function(index, data){
        datos.push($(data).val());
    });

    console.log(datos);

    $.ajax({
        type: "POST",
        url: "archivo_php.php",
        data: {datos:datos},
        success: function(response){
            
        }
    });
});

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

<div class="col-sm-4 text-left" id="checktiptrab"></div>

<button id="enviar">Enviar</button>