javascript - Showing how many form checkboxes are checked in document itself -

i have coded asp page using example here shows how many checked boxes there in form in pop-up alert box. problem have many boxes on form takes forever select box, close alert, check box, close alert… change or replace code show number of checked boxes in document's html instead of alert, updating count boxes checked or unchecked. here script used count boxes , show alert:

<script language="javascript"> function checktotalcheckedboxes() {      var checklength = 0;      var boxes = document.getelementbyid("yyy").getelementsbytagname("input");      (var = 0; < boxes.length; i++)      {          boxes[i].checked ? checklength++ : null;      }      alert (checklength + " boxes checked." ); } </script> 

i have "select all" script works great selecting boxes @ once. problem "select all" box stays checked once used, if of boxes de-selected. need modify script uncheck "select all" box user clicks it, de-selects of checked boxes.

here script:

<script language="javascript"> function toggle(source) {   checkboxes = document.getelementsbyname('checkbox');   for(var i=0, n=checkboxes.length;i<n;i++) {     checkboxes[i].checked = source.checked;   }          var checklength = 0;      var boxes = document.getelementbyid("yyy").getelementsbytagname("input");      (var = 0; < boxes.length; i++)      {          boxes[i].checked ? checklength++ : null;      }      alert (checklength + " boxes checked." ); } </script> 

many can offer!

without providing html code, can guess page layout looks like. being said, @ fiddle: https://jsfiddle.net/yxo6de48/

it should provide little guidance, if nothing else, on how achieve looking for.

javascript:

function checktotalcheckedboxes() {      var checklength = 0;      var boxes = document.getelementbyid("yyy").getelementsbytagname("input");      (var = 0; < boxes.length; i++)      {          boxes[i].checked ? checklength++ : null;      }      document.getelementbyid("count").innerhtml = checklength + " boxes checked."; }  function toggle(source) {   checkboxes = document.getelementsbyname('checkbox');   for(var i=0; < checkboxes.length;i++) {     checkboxes[i].checked = source.checked;   }    checktotalcheckedboxes(); }