Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #8060 > unrolled thread

uncheck radio group

Back to article view | Back to comp.lang.javascript

Contents

  uncheck radio group cerr <ron.eggler@gmail.com> - 2011-11-05 15:57 -0700
    Re: uncheck radio group Elegie <elegie@anonymous.invalid> - 2011-11-06 01:02 +0100
      Re: uncheck radio group Swifty <steve.j.swift@gmail.com> - 2011-11-06 07:59 +0000
    Re: uncheck radio group Denis McMahon <denismfmcmahon@gmail.com> - 2011-11-06 00:10 +0000
    Re: uncheck radio group "Evertjan." <exjxw.hannivoort@interxnl.net> - 2011-11-06 08:11 +0000
      Re: uncheck radio group "Evertjan." <exjxw.hannivoort@interxnl.net> - 2011-11-06 08:16 +0000
        Re: uncheck radio group "Evertjan." <exjxw.hannivoort@interxnl.net> - 2011-11-06 09:10 +0000
    Re: uncheck radio group Dr J R Stockton <reply1144@merlyn.demon.co.uk> - 2011-11-06 19:58 +0000

#8060 — uncheck radio group

Hi There,

I have a bunch of radio groups on a page and would like to uncheck
them all together on button click.
OnClick I trigger this function:

function uncheck(grpnr){
group="grp"+grpnr;
alert("hello!"+"\r\n"+group+"\r\n");
if (document.getElementByName(group)){
alert("Got it!");
}
for (var i=0; i<document.toppings.group.length; i++) {
  document.toppings.group[i].checked = false;
  }
}

The radio groups is called "grp4" (with the number incrementing). So i
pass the index number to this function, assemble the group name but
for some reason this doesn't seem to work, any clues what i need to do
differently? I also never get the "Got it!" message...my form tag
looks like this:

<form name="toppings" action="/store/index.php" method="POST">

Thank you for the help!

[toc] | [next] | [standalone]

#8063

On 05/11/2011 23:57, cerr wrote :

Hello,

> I have a bunch of radio groups on a page and would like to uncheck
> them all together on button click.

You can then try and use the following function:

   function uncheckAll(form) {
     var elements = form.elements;
     for(var ii=0; ii<elements.length; ii++) {
       if (elements[ii].type == "radio") {
         elements[ii].checked = false;
       }
     }
   }

... calling it while passing the form object, e.g. (for an INPUT element 
located in the same FORM as the radio controls):

<input type="button" value="Reset All"
            onclick="uncheckAll(this.form);">

Note that it is a good practice to always provide a default radio button 
per radio button group, so that the user may select this default value 
if he/she wants to manually reset the group. In such case, you would 
want to uncheck all radio buttons, except for default ones which would 
have to be checked back.

> OnClick I trigger this function:
>
> function uncheck(grpnr){
> group="grp"+grpnr;
> alert("hello!"+"\r\n"+group+"\r\n");
> if (document.getElementByName(group)){

------------------------^^-----

You probably mean the "getElementsByName" method, which returns a 
collection of all elements bearing the same name?

> alert("Got it!");
> }
> for (var i=0; i<document.toppings.group.length; i++) {

Since "group" is a variable, and that you want to use the value of this 
variable, you need to use the square bracket accessor:

   document.toppings.elements[group].length

>    document.toppings.group[i].checked = false;

and likewise:

   document.toppings.elements[group][i]

<snip>

Also, most browsers come up with a javascript console, which report 
javascript errors. Try and find yours: it will give you interesting 
information about why and where scripts fail. One should always program 
with feedback.

Regards,
Elegie.

[toc] | [prev] | [next] | [standalone]

#8066

On Sun, 06 Nov 2011 01:02:25 +0100, Elegie <elegie@anonymous.invalid>
wrote:

>Note that it is a good practice to always provide a default radio button 
>per radio button group, so that the user may select this default value 
>if he/she wants to manually reset the group. In such case, you would 
>want to uncheck all radio buttons, except for default ones which would 
>have to be checked back.

If you don't want such a default button (there are cases) then you can
create it, but set it to be invisible, using CSS.

Then, by checking this one, invisible, button, you automatically
uncheck any other one on the group.

-- 
Steve Swift
http://www.swiftys.org.uk/swifty.html
http://www.ringers.org.uk

[toc] | [prev] | [next] | [standalone]

#8065

On Sat, 05 Nov 2011 15:57:04 -0700, cerr wrote:

> Hi There,
> 
> I have a bunch of radio groups on a page and would like to uncheck them
> all together on button click.
> OnClick I trigger this function:
> 
> function uncheck(grpnr){
> group="grp"+grpnr;
> alert("hello!"+"\r\n"+group+"\r\n");
> if (document.getElementByName(group)){ alert("Got it!");
> }
> for (var i=0; i<document.toppings.group.length; i++) {
>   document.toppings.group[i].checked = false; }
> }
> 
> The radio groups is called "grp4" (with the number incrementing). So i
> pass the index number to this function, assemble the group name but for
> some reason this doesn't seem to work, any clues what i need to do
> differently? I also never get the "Got it!" message...my form tag looks
> like this:
> 
> <form name="toppings" action="/store/index.php" method="POST">
> 
> Thank you for the help!

You need to uncheck the buttons, not the groups.

This might work:

function uncheckAllRadioButtonsInDocument()
{
var inputs = document.getElementsByTagName("input");
for (var i=0; i<inputs.length; i++) if (inputs[i].type=="radio") inputs
[i].checked=false;
}

Rgds

Denis McMahon

[toc] | [prev] | [next] | [standalone]

#8067

cerr wrote on 05 nov 2011 in comp.lang.javascript:

> I have a bunch of radio groups on a page 

Where else?

> and would like to uncheck them all together on button click.

This is a wrong idea IMHO.

A radio-group without any checked is strictly illegal and error-prone.

Better make a hidden radio-button that can be checked by javascript.
And no loop is needed.


<form>
<input type='radio' name='a' value='none' 
checked style='display:none;' id='aNone'>
<label><input type='radio' name='a' value='1'> 1</label><br>
<label><input type='radio' name='a' value='2'> 2</label><br>
<label><input type='radio' name='a' value='3'> 3</label><br>
</form>

<button onclick = "document.getElementById('aNone').checked = true;">
Uncheck
</button>

-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[toc] | [prev] | [next] | [standalone]

#8068

Evertjan. wrote on 06 nov 2011 in comp.lang.javascript:

> cerr wrote on 05 nov 2011 in comp.lang.javascript:
> 
>> I have a bunch of radio groups on a page 
> 
> Where else?
> 
>> and would like to uncheck them all together on button click.
> 
> This is a wrong idea IMHO.
> 
> A radio-group without any checked is strictly illegal and error-prone.
> 
> Better make a hidden radio-button that can be checked by javascript.
> And no loop is needed.
> 
> 
> <form>
> <input type='radio' name='a' value='none' 
> checked style='display:none;' id='aNone'>
> <label><input type='radio' name='a' value='1'> 1</label><br>
> <label><input type='radio' name='a' value='2'> 2</label><br>
> <label><input type='radio' name='a' value='3'> 3</label><br>
> </form>
> 
> <button onclick = "document.getElementById('aNone').checked = true;">
> Uncheck
> </button>

>> I have a bunch of radio groups on a page 

Sorry, I now read "bunch of groups":

<button onclick = "document.getElementById('aNone').checked = 
document.getElementById('bNone').checked = 
document.getElementById('cNone').checked = 
document.getElementById('dNone').checked = true;">
Uncheck groups a,b,c,d
</button>



-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[toc] | [prev] | [next] | [standalone]

#8069

Evertjan. wrote on 06 nov 2011 in comp.lang.javascript:

> Evertjan. wrote on 06 nov 2011 in comp.lang.javascript:
> 
>> cerr wrote on 05 nov 2011 in comp.lang.javascript:
>> 
>>> I have a bunch of radio groups on a page 
>> 
>> Where else?
>> 
>>> and would like to uncheck them all together on button click.
>> 
>> This is a wrong idea IMHO.
>> 
>> A radio-group without any checked is strictly illegal and error-prone.
>> 
>> Better make a hidden radio-button that can be checked by javascript.
>> And no loop is needed.
>> 
>> 
>> <form>
>> <input type='radio' name='a' value='none' 
>> checked style='display:none;' id='aNone'>
>> <label><input type='radio' name='a' value='1'> 1</label><br>
>> <label><input type='radio' name='a' value='2'> 2</label><br>
>> <label><input type='radio' name='a' value='3'> 3</label><br>
>> </form>
>> 
>> <button onclick = "document.getElementById('aNone').checked = true;">
>> Uncheck
>> </button>
> 
>>> I have a bunch of radio groups on a page 
> 
> Sorry, I now read "bunch of groups":
> 
> <button onclick = "document.getElementById('aNone').checked = 
> document.getElementById('bNone').checked = 
> document.getElementById('cNone').checked = 
> document.getElementById('dNone').checked = true;">
> Uncheck groups a,b,c,d
> </button>

Then again, if you have no other radio-inputs with a value of 'none':

<form>
<input type='radio' name='a' value='none' 
checked style='display:none;'>
<label><input type='radio' name='a' value='1'> 1</label><br>
<label><input type='radio' name='a' value='2'> 2</label><br>
</form>

<form>
<input type='radio' name='b' value='none' 
checked style='display:none;'>
<label><input type='radio' name='b' value='1'> 1</label><br>
<label><input type='radio' name='b' value='2'> 2</label><br>
</form>

<button onclick = "unCheck()">
Uncheck all groups
</button>

<script type='text/javascript'>
function unCheck() {
  var allInputs = document.getElementsByTagName('input');
  for (var i in allInputs) 
    if (allInputs[i].type == 'radio' && allInputs[i].value == 'none')
      allInputs[i].checked = true;
};
</script>



-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[toc] | [prev] | [next] | [standalone]

#8095

In comp.lang.javascript message <3c81f60b-9264-4083-ba1f-1c87d4636197@q3
5g2000prh.googlegroups.com>, Sat, 5 Nov 2011 15:57:04, cerr
<ron.eggler@gmail.com> posted:

>I have a bunch of radio groups on a page and would like to uncheck
>them all together on button click.

Add a radiobutton to each group, and check it with your button, which
unchecks the others.  IIRC, the new button can be styled to not display.
It could also be marked "none of those".

-- 
 (c) John Stockton, nr London, UK. ?@merlyn.demon.co.uk  Turnpike v6.05  MIME.
  Web  <http://www.merlyn.demon.co.uk/> - FAQqish topics, acronyms and links;
  Astro stuff via astron-1.htm, gravity0.htm ; quotings.htm, pascal.htm, etc.
 No Encoding. Quotes before replies. Snip well. Write clearly. Don't Mail News.

[toc] | [prev] | [standalone]

Back to top | Article view | comp.lang.javascript

csiph-web