Sending checked checkbox ids to the database using jquery

Question

I have a checklist that users need to check more than one checkbox and then I should calculate the total price of each checkbox and display it. The problem is I should insert the checked checkbox into the database. So when I am using isset() function I am having an error. So I am thinking to use jquery instead and sending the ids checked to the database but I don't know how to do it.

    <form method="post" action="#">
            <div class="agileinfo_services_grids">
                <?php 
                    $sql = "SELECT * FROM services";
                    $result = mysqli_query($connection, $sql);
                    $num_rows = mysqli_num_rows($result);

                    if($num_rows > 0) {
                        while ($row = mysqli_fetch_assoc($result)) {

                            $price = $row['price'];
                            $id = $row['id'];
                            echo "<div class='col-md-4 agileinfo_services_grid'>
                                    <div class='agileinfo_services_grid1'>
                                        <div class='price'><h3>$" . $row['price'] . "</h3></div>
                                        <h4>" . $row['title'] . "</h4>
                                        <p>" . $row['details'] . "</p>
                                        <div class='agileinfo_services_grid1_pos'>
                                            <input id='$id' name:'checkbox[]' class='icon-checkbox my-activity' type='checkbox' value='$price'/>
                                            <label for='$id'>
                                                <span class='glyphicon glyphicon-unchecked unchecked'></span>
                                                <span class='glyphicon glyphicon-check checked'></span>
                                            </label>
                                        </div>
                                    </div>
                                </div>";            
                        } 
                    } else {
                        echo "No Current Services Available";
                    }
                ?>
            </div>
            <div class="total">
            <div class="total-left">
                <p>Total :<span>$<input type="text" id="amount" readonly></span>
            </div>
            <div class="total-right">
                <input type="submit" value="Check Out" name="submit">
            </div>
            <div class="clear"> </div>
        </div>
        </form>

below is the function that I used to calculate the total price of the checked boxes. How can I modify it to send to the database the ids of the checked boxes as well.

<script type="text/javascript">
    $(document).ready(function() {        
        $(".my-activity").click(function(event) {
            var total = 0;
            $(".my-activity:checked").each(function() {
                total += parseInt($(this).val());
                $.post("services.php", {id: this.id, checked:this.checked});
            });

            if (total == 0) {
                $('#amount').val('');
            } else {                
                $('#amount').val(total);
            }
        });
    });    
</script>

score 0 · Answer 1 · answered Jul 30 '17 at 10:06

0

Follow this steps to send selected ids to database.

HTML:

<div id="checkboxes">
    <input id="chkbx_0" type="checkbox" name="c_n_0" checked="checked" />Option 1
    <input id="chkbx_1" type="checkbox" name="c_n_1" />Option 2
    <input id="chkbx_2" type="checkbox" name="c_n_2" />Option 3
    <input id="chkbx_3" type="checkbox" name="c_n_3" checked="checked" />Option 4
</div>

Use this jquery script:

var selected_ids = [];
$('#checkboxes input:checked').each(function() {
    selected_ids.push($(this).attr('id'));
});

/* to sending ids to database using ajax */
$.ajax({  
    type: 'POST',  
    url: 'test.php', 
    data: { selected_ids: selected_ids },
    success: function(response) {
        alert(response);
    }
});

answered Jul 30 '17 at 10:06

Chandra Kumar

4,127
1
17
25

Thank you for your response, but the thing is how can I insert the ids in the database. I only managed to see the array in test.php by typing var_dumb($_POST) – Omar Gamal Jul 30 '17 at 10:50
What is the your table structure where you want to insert ids.. – Chandra Kumar Jul 30 '17 at 10:55
I have a table named orders where I should insert the user_id and a timestamp for when the order was submitted. Secondly I have a serviceOrder table that has the order_id and service_id(which is actually the checkboxes) . And again appreciated for your quick response – Omar Gamal Jul 30 '17 at 11:04
so I have to create the checkboxes dynamically using the services table as shown in my original question and then calculate the total price and printing it instantly which I have already achieved. the problem now that I want to insert in the table orderServices the order_id and the service_id that I should get from the ajax function you supplied me – Omar Gamal Jul 30 '17 at 11:07

Sending checked checkbox ids to the database using jquery

1 Answers1