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 tag is used to add lists into <ul> and <ol> elements?
<dt> <dd> <li>
<ul>
 <li>http://coursesweb.net/html/</li>
 <li>http://coursesweb.net/css/</li>
</ul>
Which value of the "display" property creates a block box for the content and ads a bullet marker?
block list-item inline-block
.some_class {
  display: list-item;
}
Which instruction converts a JavaScript object into a JSON string.
JSON.parse() JSON.stringify eval()
var obj = {
 "courses": ["php", "javascript", "ajax"]
};
var jsonstr = JSON.stringify(obj);
alert(jsonstr);    // {"courses":["php","javascript","ajax"]}
Indicate the PHP class used to work with HTML and XML content in PHP.
stdClass PDO DOMDocument
$strhtml = '<body><div id="dv1">CoursesWeb.net</div></body>';
$dochtml = new DOMDocument();
$dochtml->loadHTML($strhtml);
$elm = $dochtml->getElementById("dv1");
echo $elm->nodeValue;    // CoursesWeb.net
Get the value of the selected /checked checkboxes in a form

Last accessed pages

  1. Contact page - CoursesWeb (27709)
  2. Tabs effect with CSS (28381)
  3. Making DIV Contents Scroll Horizontally, with multiple Div`s inside (34995)
  4. Nested Objects - Traverse object (631)
  5. JavaScript code and PHP (26662)

Popular pages this month

  1. Making DIV Contents Scroll Horizontally, with multiple Div`s inside (1797)
  2. Contact page - CoursesWeb (1752)
  3. Tabs effect with CSS (1746)
  4. PHP getElementById and getElementsByTagName (826)
  5. Get Attribute (ID, Class, Name, Title, Src) with jQuery (702)