Store an array value in jQuery from checkbox

Question

Hye,

Been trying to do this but still with no solution. I want to store an Input checkbox with array from a form and post the value of the selected checkbox using jQuery for delete purpose. I'm unable to get the checkbox value when user make the selection more than 1. May I know the right way to store an array value using jQuery. Below are the codes for html checkbox:

<input type="checkbox" name="checkBox[]" id="checkBox" value='".$row['staff_id']."'>

and this are the jQuery:

$(document).ready(function() {
$("#del").click(function(){
    var del = $("#del").val();
    var checkBox = $("#checkBox:checked").val();
    $.post('admin_cuti/staff-delete.php',
    {
        del : del,
        checkBox : checkBox
    }, function(data){
        $("#result_del").html(data)
       });  
    });
});

update with full codes on my delete.php. User can click on multiple checkboxes to delete the data. On my case, it can only delete 1 row. Below are the codes:

<?php
require_once('../db_connection/connection-intra.php');
//Delete function
if(isset($_POST['del'])){
    if(empty($_POST['checkBox'])){
        echo "<span style="."color:red"."><br>&nbsp;No record selected</span><p/>";
    }
    elseif(isset($_POST['checkBox'])){
        $checkbox = $_POST['checkBox'];
        for($i=0;$i<count($_POST['checkBox']);$i++){
            $del_id = $checkbox[$i];

            $sql = "DELETE FROM staff WHERE staff_id='$del_id'";
            if (mysqli_query($conn, $sql)) {
                echo "Record deleted successfully";
            } else {
                echo "Error deleting record: " . mysqli_error($conn);
            } 
        } 
    } 
} //end of delete function 
?>

Im still in the process of learning for web programming especially in jquery and javascript. Do give me an advice/comment, thanks!

Ids should be unique for each element and you are duplicating those. — Jai
– Jai, Commented Dec 15, 2015 at 9:50
Im using multiple checkboxes on a while loop in php & including the ids — Amran
– Amran, Commented Dec 15, 2015 at 10:01

madalinivascu · Accepted Answer · 2015-12-16 05:00:20Z

1

try:

    $("#del").click(function(){
        var del = $(this).val();
        var checkBox = $(this).closest('form').find('input[type="checkbox"]:checked');
var values = [];
   $.each(checkBox,function(i,v){
       values.push($(v).val());
   });
        $.post('admin_cuti/staff-delete.php',
        {
            del : del,
            checkBox : values
        }, function(data){
            $("#result_del").html(data)
           });  
        });

edited Dec 16, 2015 at 5:00

answered Dec 15, 2015 at 10:00

madalinivascu

32.4k4 gold badges41 silver badges59 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Amran Over a year ago

I tried the codes but it still select 1 row only. If user choose more than 1, it will select the most top value of the choosen checkboxes

Milind Anantwar · Accepted Answer · 2015-12-15 10:02:19Z

0

You have duplicate IDs for checkbox elements. and id selector only select first element in matched set. you can rather use same class(say checkBox) for all checkboxes and then target them using class selector:

var checkBox = $(".checkBox:checked").val();

you can also use attribute equal sector to target checkboxes based on name attribute:

var checkBox = $('[name="checkBox[]"]:checked').val();

answered Dec 15, 2015 at 10:02

Milind Anantwar

82.3k26 gold badges97 silver badges128 bronze badges

2 Comments

Amran Over a year ago

i tried to use the class but it only select 1 row only for the value

Milind Anantwar Over a year ago

@Amran: can you share the fiddle.

Collectives™ on Stack Overflow

Store an array value in jQuery from checkbox

2 Answers 2

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related