How do I save data from a checkbox array into database

Question

function check_uncheck(truefalse) {
  var boxes = document.forms[0].chkboxarray.length;
  var form = document.getElementById('checkForm');
  for (var i = 0; i < boxes; i++) {
    if (truefalse) {
      form.chkboxarray[i].checked = true;
    } else {
      form.chkboxarray[i].checked = false;
    }
  }
}

<form name="checkForm" id="checkForm" method="post" action="checkboxes1.php">
  <input type="checkbox" name="chkboxarray" value="1" /><br />
  <input type="checkbox" name="chkboxarray" value="2" /><br />
  <input type="button" name="CheckAll" value="Check All Boxes" onclick="check_uncheck(true)" />
  <input type="button" name="UncheckAll" value="Uncheck All Boxes" onclick="check_uncheck(false)" />
  <input type="submit" value="Save">

</form>

The snippet shows how it works without connection to a database

I am trying to save the data that is sent from the checklist to a database but i'm stuck. I was thinking of using a foreach but I don't know what to put in it.

I though of putting it as:

foreach($_POST['id'] as $add){
insert into database...
}

How do I do this?

If I do this as Fred-ii and xjstratedgebx suggested where I just change name="chkboxarray" to name="chkboxarray[]" then the javascript code would stop working.

<?php
include '../conec.php';
mysql_select_db("test",$conec)or die('Database does not exist.') or die(mysql_error());

$sql = mysql_query("SELECT * FROM user WHERE state='Not Signed Up'");
?>

<form name="checkForm" id="checkForm" method="post" action="checkboxes1.php">
    <?php
    while($row = mysql_fetch_array($sql)){
        $id = $row['id'];
        $name = $row['name'];
        $lName= $row['lName'];
        $concate = $name.' '.$lName;
        echo '<input type="checkbox" name="chkboxarray" value="'.$id.'" />'.$concate.'<br />';
    }


    ?>
    <!--<input type="checkbox" name="chkboxarray" value="1" /><br />
    <input type="checkbox" name="chkboxarray" value="2" /><br />-->
    <input type="button" name="CheckAll" value="Check All Boxes" onclick="check_uncheck(true)" />
    <input type="button" name="UncheckAll" value="Uncheck All Boxes" onclick="check_uncheck(false)" />
    <input type="submit" value="Save">

</form>

<script type="application/javascript">
function check_uncheck(truefalse){
    var boxes = document.forms[0].chkboxarray.length;
    var form = document.getElementById('checkForm');
    for(var i=0;i < boxes;i++){
        if (truefalse) {
            form.chkboxarray[i].checked=true;
        } else {
            form.chkboxarray[i].checked=false;
        }
    }
}
</script>

Could you please explain yourself a litlte bit better?

wilsotobianco
– wilsotobianco

2016-02-29 03:18:25 +00:00
Commented Feb 29, 2016 at 3:18 — wilsotobianco
– wilsotobianco, Commented Feb 29, 2016 at 3:18
What else do you need to know?

learningbyexample
– learningbyexample

2016-02-29 03:22:29 +00:00
Commented Feb 29, 2016 at 3:22 — learningbyexample
– learningbyexample, Commented Feb 29, 2016 at 3:22

stratedge · Accepted Answer · 2016-02-29 05:25:42Z

2

If you change the name of your checkbox from "chkboxarray" to "chkboxarray[]", then any boxes that are checked when the form is submitted will pass their values as an array to the server under the key of "chkboxarray".

Basically, change this line:

echo '<input type="checkbox" name="chkboxarray" value="'.$id.'" />'.$concate.'<br />';

To:

echo '<input type="checkbox" name="chkboxarray[]" value="'.$id.'" />'.$concate.'<br />';

As a result, if you var_dump the $_POST super global, you should see something like:

array(1) {
    [chkboxarray]=>
    array(2) {
        [0]=>
        string(1) "3"
        [1]=>
        string(1) "4"
    }
}

In the example above, the checkboxes for id's 3 and 4 were checked, so they were sent to the server.

Once you have that array, inserting it into your database depends heavily on what you're trying to accomplish and your database's schema.

Hope that helps.

Also, in fairness, this is exactly what @Fred meant in his comment.

Edit 1

To make the javascript work with the change of the input name, you'll need to update all the places in your javascript where you were referencing the name of the input to the new name (chkboxarray[]).

The resulting code should look like this:

<script type="application/javascript">
    function check_uncheck(truefalse) {
        var boxes = document.forms[0]["chkboxarray[]"].length;
        var form = document.getElementById('checkForm');
        for (var i = 0; i < boxes; i++) {
            if (truefalse) {
                form["chkboxarray[]"][i].checked = true;
            } else {
                form["chkboxarray[]"][i].checked = false;
            }
        }
    }
</script>

I've created a fiddle to show this works for checking/unchecking all the boxes: https://jsfiddle.net/solvomedia/3Ln468u3/

edited Feb 29, 2016 at 5:25

answered Feb 29, 2016 at 3:23

stratedge

2,83020 silver badges15 bronze badges

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

6 Comments

Funk Forty Niner Over a year ago

"Also, in fairness, this is exactly what @Fred meant in his comment." - Thanks for the mention. Least "you" saw my comment and said something about it, to which I ended up deleting. I didn't get a response after 5 mins, and that's the lifespan I have. When they don't comment, I delete and move on. My comment only consisted of name="chkboxarray" => name="chkboxarray[]" so I figured they knew what to do about it, but probably not (hard to say). I wish you well on this and hope it will solve OP's code. Cheers

learningbyexample Over a year ago

Sorry @Fred-ii- i did not comment because when I saw that I already knew I could do that but the problem when I do that is that my javascript code does not function anymore var boxes = document.forms[0].chkboxarray.length;

stratedge Over a year ago

It's been a long time since I tried to get form fields with straight JavaScript, and this is untested, but try changing that line to var boxes = document.forms[0]["chkboxarray[]"].length;

stratedge Over a year ago

Updated my answer to fix the javascript. Missed the two other places where the inputs' name was being referenced in my original comment.

learningbyexample Over a year ago

I didn't know it was called like this too form["chkboxarray[]"][i]

|

Collectives™ on Stack Overflow

How do I save data from a checkbox array into database

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related