In this page it is presented a JavaScript function that can be used to get the values of the selected (checked) checkboxes added into a form. The function receives the object with that form, then, returns an Array with the value of each selected /checked checkbox into that <form>

Code of the function

// Returns an array with values of the selected (checked) checkboxes in 'frm'
function getSelectedChbox(frm){
 // JavaScript & jQuery Course - https://coursesweb.net/javascript
 var selchbox =[]; // array that will store the value of selected checkboxes

 // gets all the input tags in frm, and their number
 var inpfields = frm.getElementsByTagName('input');

 // traverse the inpfields elements, and adds the value of selected (checked) checkbox in selchbox
 for(var i=0; i<inpfields.length; i++) {
 if(inpfields[i].type =='checkbox' && inpfields[i].checked == true) selchbox.push(inpfields[i].value);
 }

 return selchbox;
}

Example usage getSelectedChbox() function. When click on a button into a form with various checkboxes, it opens an alert window with the values of the selected checkboxes.
<h4>Example getting value of the selected checkboxes</h4>
<p>Select some checkboxes, then click the Click button.</p>

Check the web site programming language you know:
<form action='script.php' method='post'>
<input type='checkbox' name='chb[]' value='html' />HTML<br>
<input type='checkbox' name='chb[]' value='css' />CSS<br>
<input type='checkbox' name='chb[]' value='javascript' />JavaScript<br>
<input type='checkbox' name='chb[]' value='php' />php<br>
<input type='checkbox' name='chb[]' value='python' />Python<br>
<input type='checkbox' name='chb[]' value='net' />Net<br>
<input type='button' value='Click' id='btntest' />
</form>

<script>
// Returns an array with values of the selected (checked) checkboxes in 'frm'
function getSelectedChbox(frm){
 // JavaScript & jQuery Course - https://coursesweb.net/javascript
 var selchbox = []; // array that will store the value of selected checkboxes

 // gets all the input tags in frm, and their number
 var inpfields = frm.getElementsByTagName('input');

 // traverse the inpfields elements, and adds the value of selected (checked) checkbox in selchbox
 for(var i=0; i<inpfields.length; i++){
 if(inpfields[i].type =='checkbox' && inpfields[i].checked == true) selchbox.push(inpfields[i].value);
 }

 return selchbox;
}

 /* Test this function */
// When click on #btntest, alert the selected values
document.getElementById('btntest').onclick = function(){
 var selchb = getSelectedChbox(this.form); // gets the array returned by getSelectedChbox()
 alert(selchb);
}
</script>

Daily Test with Code Example

HTML
CSS
JavaScript
PHP-MySQL
Which attribute specifies the HTTP method (GET, POST) used to submit the form-data?
action method value
<form action="script.php" method="post"> ... </form>
Which CSS property allows to add shadow to boxes?
background-image box-shadow border-radius
#id {
  background-color: #bbfeda;
  box-shadow: 11px 11px 5px #7878da;
}
Which function removes the first element from an array?
pop() push() shift()
var fruits = ["apple", "apricot", "banana"];
fruits.shift();
alert(fruits.length);           // 2
Indicate the function that can be used to check if a PHP extension is instaled.
function() filetype() extension_loaded()
if(extension_loaded("PDO") === true) echo "PDO is available."
Get the value of the selected /checked checkboxes in a form

Last accessed pages

  1. Objects in 3D Space (1191)
  2. Ajax-PHP Chat Script (43927)
  3. Draw arrow markers with clicks in html element (2269)
  4. Count the number of downloads and accesses (962)
  5. Sending data with GET and POST in the same request (5167)

Popular pages this month

  1. Courses Web: PHP-MySQL JavaScript Node.js Ajax HTML CSS (118)
  2. PHP-MySQL free course, online tutorials PHP MySQL code (66)
  3. Read Excel file data in PHP - PhpExcelReader (66)
  4. Register and show online users and visitors (61)
  5. JavaScript Course - Free lessons (50)