Using Array With Radio Buttons

[tomyknoker]

Hi all,
Just started javascript and have a pretty simple question. I have set up a form and it has 4 RadioButtons and 4 CheckBox's in it. Here is what I need, I have a submit button and once it is pressed I need an alert box to pop up if no buttons have been pressed telling the user that atleast I of the buttons and checkboxs must be pressed. I have been told that I must do this with an array but have no idea how...any help would be much appreciated,
thanks,
Tom

[Gollum]

When HTML elements are given the same name they will be accessed in Javascript as an array. So with your radio buttons and checkboxes defined like this...

<form name=f>
<input type=radio name=myRadio value=r1>Radio1
<input type=radio name=myRadio value=r2>Radio2
<input type=radio name=myRadio value=r3>Radio3
<input type=radio name=myRadio value=r4>Radio4
<input type=checkbox name=myCheckbox value=c1>Check1
<input type=checkbox name=myCheckbox value=c2>Check2
<input type=checkbox name=myCheckbox value=c3>Check3
<input type=checkbox name=myCheckbox value=c4>Check4
</form>

your javascript can access each radio button and checkbox as an element in an array...

if ( document.f.myRadio[0].checked ) alert("Radio1 checked");
if ( document.f.myCheckbox[2].checked ) alert("Check3 checked");

[tomyknoker]

hey,
thanks heaps for that, I have another query though:
when the submit button is pressed if know radio buttons have been pressed I want a pop up window to come up saying "please select at least one radio button" and if no radio buttons are selected I want is to say "please select at least one checkbox option"
thanks in advance,
tom

[Gollum]

you can use the onsubmit event on the form...

<form ... onsubmit="return validate(this);">


function validate(oThis)
{
if ( <no buttons pressed> ) { alert("tell them off here!"); return false;
else return true;
}

the return value is important as it tells the form whether to continue with the submit or not.

note that the onsubmit handler doesn't get called when you call document.f.submit();, only when submit buttons are pressed.

[tomyknoker]

sorry to be a pain...but the thing is I have to do the alert with an array as this is just an introductory assignment that I am working on, I have been given this to help...

value=new Array;
for (number=1; number<=100; number=number+1)
{ value[number]=number*10};

apparently this is meant to be able to alert if no radio buttons are pressed,
thanks again,
tom

[Gollum]

So long as you give all your radio buttons the same name, and all of your checkboxes an alternate (but same as each other) name, then you can access them as an array.
I'm guessing though that you want to see the array accessed with a for loop...

function validate(oForm)
{
var bRadio = false;
for ( var i = 0; i < oForm.myRadio.length; i++ ) if ( oForm.myRadio[i].checked ) { bRadio = true; break; }

var bCheck = false;
for ( var i = 0; i < oForm.myCheckbox.length; i++ ) if ( oForm.myCheckbox[i].checked ) { bCheck = true; break; }

if ( !bRadio || !bCheck )
{
alert("Go on! select one radio and tick one checkbox! Pleeeeaaassse!");
return false;
}
else return true;
}