java script clear all function for check and radios

in a previous posting http://www.experts-exchange.com/Web/Web_Languages/JavaScript/Q_21476306.html
i was asking help to selectAll check boxes and radio buttons

and both members gave me insightful and correct information

but now as im moving along im getting stumped again

i thought that checkboxes and radio buttons are toggle buttons????

i have a link on my application to select all and it works
but i also want to click that same link to have the items in the checkbox clear all as well

do i need to code another function called clearAll
and another link such as this
or should this toggle on it own????

if (appList.get(1).equals("R")) // click the R link to select All
{
    headerValue = "<a href=\"#\" onclick=\"SelectAll('R')\">R</a>";
}

// i want to be able to click the same R link to clearAll

is this possible?????

and would my ClearAll function look similar to my selectAll

//posted below

<script language="JavaScript" type="Text/JavaScript">
function SelectAll()
{
var frm = document.frm
var el = frm.elements

   
    for ( i = 0; i < el.length; i++)
    {
      if (el[i].type == "checkbox")
      {
        el[i].selected = el[i].checked = true;
      }
      else (el[i]. type == "radio")//trying to do this with radios too -- working somewhat as of now
      {
        el[i].selected = el[i].checked = true;
      }
    }
}
function ClearAll()
{
  var frm = document.frm
  var el = frm.elements
 
  for ( i = 0; i < el.length; i++)
  {
    if (el[i].type == "checkbox")
    {
      el[i].selected = el[i].checked = false;
    }
   
  }
}

</script>
annie613Asked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

RoonaanCommented:
For checkboxes, this is the most solid code I could ever find:

<script type="text/javascript">
  function checkAll(mainck)
  {
    elems = mainck.form.elements;
    for(i = 0; i < elems.length; i++)
    {
      if(elems[i].type == "checkbox")
      {
        elems[i].checked = mainck.checked;
      }
    }
  }
</script>
<form>
  <fieldset>
    <input type="checkbox" />a<br />
    <input type="checkbox" />b<br />
    <input type="checkbox" />c<br />
    <input type="checkbox" />d<br />
    <input type="checkbox" />e<br />
    <input type="checkbox" />f<br />
  </fieldset>
  <fieldset>
    <input type="checkbox" onclick="checkAll(this);" />
  </fieldset>
</form>

Can you explain what the selectAll should be doing with the radio buttons?

-r-
annie613Author Commented:
well im more concerned with the clearAll

i have the selectAll function selecting all the checkboxes when i click onthe link R

i want to be able to click on the same link R and clear all the checkboxes???

is that possible or do i need to put in another link called clearAll and use the ClearAll function


as for the radio buttons i have 3 links called A B C when I click on link A i want it to select all the A radios from the group
same if i click B or C

hackman_3vilGuyCommented:
You can use the above function like this:

<script type="text/javascript">
var tf = true;
  function toggle(button)
  {
    elems = button.form.elements;
    for(i = 0; i < elems.length; i++)
    {
      if(elems[i].type == "checkbox" ||)
      {
        elems[i].checked = tf;
      }
    }
tf = !tf;
  }
</script>
<form>
    <input type="checkbox" />a<br />
    <input type="checkbox" />b<br />
    <input type="checkbox" />c<br />
    <input type="checkbox" />d<br />
    <input type="checkbox" />e<br />
    <input type="checkbox" />f<br />
    <A HREF="#" onclick="toggle(this);return false;">Check/Uncheck All</A>
</form>

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Your Guide to Achieving IT Business Success

The IT Service Excellence Tool Kit has best practices to keep your clients happy and business booming. Inside, you’ll find everything you need to increase client satisfaction and retention, become more competitive, and increase your overall success.

annie613Author Commented:
thanks hackman the code looks good
my final question to this toggle select all question is this

my form is set up as a table and in one column i have a lable and checkbox with about 20 elements
and in the second column i again have a lable and checkbox with 4 elements (this are child apps to the first column)

when i selectAll it works
but i never want it to select those 4 child checkboxes unless the user manually does it

i have some code here
and commented out what i was trying to do since its not really working yet

can anyone make a suggestion

  function SelectAll()
  {
    var frm = document.frm
    var el = frm.elements
   
    //var inputSize =(document.forms[0].elements.length - 4) - <%= (childList.size() / 2) %>;

    //for( k = 0; k < lessChild.length; k++)
    //{

      //elementValue = document.forms[0].elements[k].value;
      //elementValue = elementValue.substring(2, elementValue.length);
     
      for ( i = 0; i < el.length; i++)
      {
        if (el[i].type == "checkbox")
        {
          el[i].selected = el[i].checked = true;
        }
        else (el[i].type == "radio")
        {
          el[i].selected = el[i].checked = true;
        }
      }
    //}
  }//end SelectAll()
RoonaanCommented:
>well im more concerned with the clearAll

My code copies the checked value of the checkAll checkbox, to all appropriate checkboxes. Hence, when you check the check all, it checks all, when you uncheck the checkall, it unchecks.

-r-
annie613Author Commented:
thanks roonaan and hackman! :) cheers!!!!
hackman_3vilGuyCommented:
Thanks for the points =)
annie613Author Commented:
working result!!!


<script language="JavaScript" type="Text/JavaScript">
  var boxChecked = false;

  function SelectAll(selectedValue)
  {
    var frm = document.frm
    var el = frm.elements
   
    for ( i = 0; i < el.length; i++)
    {
      if (el[i].type == "checkbox")
      {
        if (boxChecked == true)
        {
          el[i].checked = false;
        }
        else
        {
          el[i].checked = true;
        }
      }

      if (el[i].type == "radio")
      {
        var priv = el[i].value;
        priv = priv.substring(2, priv.length);
       
        if (priv == selectedValue)
        {
          el[i].checked = true;
        }
        else
        {
          el[i].checked = false;
        }        
      }      
    }
   
    if (boxChecked == true)
    {
      boxChecked = false;
    }
    else
    {
      boxChecked = true;
    }
  }//end SelectAll()
 
  </script>
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.