plain javascript - get the value of a checked checkbox

Question

var vettore = document.getElementById(id_form).elements;


for (var i = 0; i < vettore.length; i++)
   {
    if (vettore[i].checked)
            {
            contatore++;

            valore_corrente = document.getElementById.elements[i].value;

            stringaFileSelezionati+= valore_corrente;

            stringaFileSelezionati+= '?';
            }
   }

  if (contatore == 0) 
{
alert('Error!!! No file selected!');
return false;
}
 else 
{
    alert(stringaFileSelezionati);

}

The error is in the line:

valore_corrente = document.getElementById.elements[i].value;

how can i get that value?

EDITED: Maybe the error is in the checkboxes creation since I got undefined:

                                    cell1.innerHTML = '<input type="checkbox" name="' + 'checkbox'+" value=" + vettore_nomi_file[i] + '" id="' +i+ '" />'+vettore_nomi_file[i];

id's should be unique on the page. So getElementById should only ever return one element. If this isn't the case your markup is technically invalid. — Liam
– Liam, Commented Dec 17, 2013 at 10:51
@AndréJunges right, you need to read the docs on getElementById — Liam
– Liam, Commented Dec 17, 2013 at 10:53
It's the ID of a form and with elements I take all it's child elements: all it's checkboxe — newtphp
– newtphp, Commented Dec 17, 2013 at 10:59

T.J. Crowder · Accepted Answer · 2013-12-17 11:22:32Z

2

You retrieve .value from the same object you retrieved .checked from:

valore_corrente = vettore[i].value;

The object is an HTMLInputElement instance. The value of the checkbox is reflected in the value property, just like whether it's checked is reflected in the checked property.

Here's a complete, working example: Live Copy | Source

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Example</title>
</head>
<body>
  <form id="theform">
    <label><input type="checkbox" value="1" checked>Uno</label>
    <br><label><input type="checkbox" value="2" checked>Due</label>
    <br><label><input type="checkbox" value="3">Tre</label>
    <br><input type="button" id="thebutton" value="Click">
  </form>
  <script>
    document.getElementById("thebutton").onclick = function() {
      var id_form = "theform";
      var vettore = document.getElementById(id_form).elements;

      var contatore = 0;
      var valore_corrente;
      var stringaFileSelezionati = "";

      for (var i = 0; i < vettore.length; i++)
      {
        if (vettore[i].checked)
        {
          contatore++;

          valore_corrente = vettore[i].value;

          stringaFileSelezionati+= valore_corrente;

          stringaFileSelezionati+= '?';
        }
      }

      if (contatore == 0) 
      {
        alert('Error!!! No file selected!');
        return false;
      }
      else 
      {
        alert(stringaFileSelezionati);

      }

    };
  </script>
</body>
</html>

edited Dec 17, 2013 at 11:22

answered Dec 17, 2013 at 10:51

T.J. Crowder

1.1m201 gold badges2k silver badges2k bronze badges

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

9 Comments

newtphp Over a year ago

With valore_corrente = vettore[i].value; I get error: undefinedon? (this was my first try)

T.J. Crowder Over a year ago

@newtphp: It works for me if I declare variables. Note that in your code, you're not declaring several variables, and in one case (stringaFileSelezionati) you're trying to use the value of it without having either declared it or given it a value. If you just assign to something you haven't declared, you fall prey to The Horror of Implicit Globals and it seems to work. But if you try to read a value from something you haven't declared, that's a runtime error.

T.J. Crowder Over a year ago

@newtphp: Well, I don't know what to tell you. If vettore[i].checked is true, vettore[i].value will not be undefined. It can be a blank string, but not undefined. And as you can see from the example, it does work.

T.J. Crowder Over a year ago

@newtphp: That seems unlikely.

T.J. Crowder Over a year ago

@newtphp: If you're seeing "on", that means you're not succeeding in setting the value attribute of the input element. The default value for a checkbox is "on" (when checked). The reason for that is your code for setting the cell's content messes up its quotes. This fixes those quotes:

cell1.innerHTML = '<input type="checkbox" name="checkbox" value="' + vettore_nomi_file[i] + '" id="' +i+ '" />'+vettore_nomi_file[i];

But note that using an id value starting with a digit will lead to trouble with CSS selectors (it's fine otherwise).

|

DontVoteMeDown · Accepted Answer · 2013-12-17 10:49:09Z

1

I believe this should work:

valore_corrente = vettore[i].value;

answered Dec 17, 2013 at 10:49

DontVoteMeDown

21.5k10 gold badges72 silver badges113 bronze badges

Collectives™ on Stack Overflow

plain javascript - get the value of a checked checkbox

2 Answers 2

9 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

9 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related