Get the value of the selected /checked checkboxes in a form

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>

<<-Replace JavaScript variable name .. -- Get Lower, Higher and ..->>

Daily Test with Code Example

HTML

CSS

JavaScript

PHP-MySQL

Which attribute indicates that an input field must be filled out before submitting?

required="required" autofocus="autofocus" placeholder="text"

<input type="text" name="name1" required="required" />

Which CSS method increases or decreases the size of the HTML element (including its content)?

translate() scale() skew()

#some_id:hover {
  transform: scale(2, 1.5);
  -ms-transform: scale(2, 1.5);    /* IE 9 */
  -moz-transform: scale(2, 1.5);   /* Firefox */
}

Click on the Date object method that returns the day of the month.

setDate() getMonth() getDate()

var rightnow = new Date();
var day = rightnow.getDate();
alert(day);

Which function is used to upload a file on server?

is_file() move_uploaded_file() fopen()

if(move_uploaded_file($_FILES["field_name"]["tmp_name"], "dir/file_name")) {
  echo "The file succesfully uploaded";
}

Last accessed pages

PhpSpreadsheet - Read, Write Excel and LibreOffice Calc files ^(12022)
Multiple Select Dropdown List with JavaScript ⁽⁸²¹⁹⁾
Creating objects in ActionScript ⁽⁷⁴⁶⁰⁾
Insert, Select and Update NULL value in MySQL ^(30120)
Node.js Working with Directories ⁽⁷⁸⁶⁾

Popular pages this month

Insert, Select and Update NULL value in MySQL ⁽⁴¹⁶⁾
Read Excel file data in PHP - PhpExcelReader ⁽³³¹⁾
PhpSpreadsheet - Read, Write Excel and LibreOffice Calc files ⁽²⁵⁸⁾
PHP getElementById and getElementsByTagName ⁽²⁰⁸⁾
Courses Web: PHP-MySQL JavaScript Node.js Ajax HTML CSS ⁽¹⁹⁹⁾