Javascript Course

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 adds a new line into a paragraph?
<b> <br> <p>
First line ...<br>
Other line...
Which CSS property can be used to add space between letters?
text-size word-spacing letter-spacing
#id {
  letter-spacing: 2px;
}
What JavaScript function can be used to get access to HTML element with a specified ID?
getElementById() getElementsByTagName() createElement()
var elm = document.getElementById("theID");
var content = elm.innerHTML;
alert(content);
Click on the "echo" correct instruction.
echo "CoursesWeb.net" echo "CoursesWeb.net"; echo ""CoursesWeb.net";
echo "Address URL: http://CoursesWeb.net";
Get the value of the selected /checked checkboxes in a form

Last accessed pages

  1. Add sounds and audio effects in Flash (3492)
  2. Detect when ScrollBar reaches the bottom of the page (4384)
  3. JQZoom Image Magnifier (12996)
  4. Simple arithmetic calculator in PHP (2104)
  5. querySelector and querySelectorAll (30064)

Popular pages this month

  1. Courses Web: PHP-MySQL JavaScript Node.js Ajax HTML CSS (326)
  2. PHP Unzipper - Extract Zip, Rar Archives (86)
  3. Read Excel file data in PHP - PhpExcelReader (82)
  4. The Mastery of Love (78)
  5. PHP-MySQL free course, online tutorials PHP MySQL code (65)