473,320 Members | 2,146 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,320 software developers and data experts.

Please tell me the generic way to check different radio button groups?

I want to check each button groups and save the checked value into a 2
dimensional array. But, it doesn't work. Could anyone tell me what's
wrong with my code. My code is as follow:

<html>
<body>
<script language="javascript">
<!--
var temp = new Array(2)
var status = new Array();

function getRadios( paramform )
{
for( var iElement=0; iElement<paramform.elements.length; iElement++ )
{
if( paramform.elements[iElement].checked )
{
temp[0] = paramform.elements[iElement].name;
temp[1] = paramform.elements[iElement].value;
status[status.length] = temp;
}
}
}

<form name="training">
<table>
<tr>
<td>Microsoft Outlook: </td>
<td>
<input type='radio' name="outlook" value="START"
onClick="getRadios(document.training)"> START
<input type='radio' name="outlook" value="COMPLETED"
onClick="getRadios(document.training)"> COMPLETED
<input type='radio' name="outlook" value="IN PROGRESS"
onClick="getRadios(document.training)"> INPROGRESS
</td>
</tr>

<tr>
<td>Microsoft Word: </td>
<td>
<input type='radio' name="word" value="START"
onClick="getRadios(document.training)"> START
<input type='radio' name="word" value="COMPLETED"
onClick="getRadios(document.training)"> COMPLETED
<input type='radio' name="word" value="IN PROGRESS"
onClick="getRadios(document.training)"> INPROGRESS
</td>
</tr>

</table>
</form>

</body>
</html>
Jul 23 '05 #1
15 2086
tabonni wrote:
I want to check each button groups and save the checked value into a 2
dimensional array. But, it doesn't work.
"Does not work" is a useless error description. [psf 4.11]
Could anyone tell me what's wrong with my code.
Could you tell us what you expected and what you observed?
My code is as follow:

<html>
<body>
<script language="javascript">
<http://validator.w3.org/>
<!--
Remove this, it is obsolete.
var temp = new Array(2)
In ECMAScript/J(ava)Script, arrays are dynamic by nature. Dimensioning
the array on initialization is not only unnecessary, but also error-prone.
Particularly a number as sole constructor argument may cause an array with
two undefined elements to be created in one implementation, and an array
with one element of type "number" with value 2 in another.
var status = new Array();

function getRadios( paramform )
{
for( var iElement=0; iElement<paramform.elements.length; iElement++ )
{
if( paramform.elements[iElement].checked )
{
temp[0] = paramform.elements[iElement].name;
temp[1] = paramform.elements[iElement].value;
status[status.length] = temp;
}
}
}
You look up references far too often which makes the script run slow.
Consider this:

function getRadios(f)
{
if (f && (e = f.elements))
{
for (var iElement = 0, len = e.length; iElement < len; i++)
{
var o = e[iElement];
if (o.checked)
{
status[status.length] = [o.name, o.value];
}
}
}
}

And, as you see, do not use tab chracters for indentation,
especially not when posting code.
<form name="training">
<table>
<tr>
<td>Microsoft Outlook: </td>
Do not use tables for layout purposes alone.
<td>
<input type='radio' name="outlook" value="START"
onClick="getRadios(document.training)"> START
[...]>
</form>


No need for proprietary referencing like `document.training'
and no need for defining the listener for every element. Use
event bubbling instead:

function getRadios(e)
{
var t = (e && e.target) || event.srcElement;
if (t.tagName && t.tagName.toLowerCase() == "input"
&& t.type && t.type.toLowerCase() == "radio")
{
if (t.checked)
{
status[status.length] = [t.name, t.value];
}
}
}

<form ... onclick="getRadios(event)">
...
</form>

But the problem with your code and even with my code is that you always
add elements to the array, even if the required data is already added.
This looks like a problem suited more for Object objects instead of Array
objects, but why do you think you need to store the values in an array
although already stored in DOM objects in the first place?
PointedEars
Jul 23 '05 #2
tabonni wrote:
I want to check each button groups and save the checked value into a 2
dimensional array. But, it doesn't work. Could anyone tell me what's
wrong with my code. My code is as follow:

<html>
<body>
<script language="javascript">
<!--
var temp = new Array(2)
var status = new Array();

function getRadios( paramform )
{
for( var iElement=0; iElement<paramform.elements.length; iElement++ )
{
if( paramform.elements[iElement].checked )
{
temp[0] = paramform.elements[iElement].name;
temp[1] = paramform.elements[iElement].value;
status[status.length] = temp;
}
}
}

Along with Thomas' observations, why not terminate the loop when you
find an element checked?

Mick
Jul 23 '05 #3
My purpose on storing each radio name and value into an array is for
me to set the cookie easier (I think).

My idea is:
I got a form with different radio button groups. After the user check
the radio values, I will store names and values into a 2D array. For
example: the user check "outlook, start" and "word, completed", I will
put it into status[0][0]=outlook, status[0][1]=start,...

Then, I can put them into cookie like: Use a for..loop and setCookie(
status[name], status[value]); And later on, I can get the data in the
cookie and display on the form again.
Cheers
Bonnie

Mick White <mw******@BOGUSrochester.rr.com> wrote in message news:<c_********************@twister.nyroc.rr.com> ...
tabonni wrote:
I want to check each button groups and save the checked value into a 2
dimensional array. But, it doesn't work. Could anyone tell me what's
wrong with my code. My code is as follow:

<html>
<body>
<script language="javascript">
<!--
var temp = new Array(2)
var status = new Array();

function getRadios( paramform )
{
for( var iElement=0; iElement<paramform.elements.length; iElement++ )
{
if( paramform.elements[iElement].checked )
{
temp[0] = paramform.elements[iElement].name;
temp[1] = paramform.elements[iElement].value;
status[status.length] = temp;
}
}
}

Along with Thomas' observations, why not terminate the loop when you
find an element checked?

Mick

Jul 23 '05 #4
Thomas 'PointedEars' Lahn <Po*********@nurfuerspam.de> wrote in message news:<41************@PointedEars.de>...
tabonni wrote:
I want to check each button groups and save the checked value into a 2
dimensional array. But, it doesn't work.


"Does not work" is a useless error description. [psf 4.11]
Could anyone tell me what's wrong with my code.


Could you tell us what you expected and what you observed?
My code is as follow:

<html>
<body>
<script language="javascript">


<http://validator.w3.org/>
<!--


Remove this, it is obsolete.
var temp = new Array(2)


In ECMAScript/J(ava)Script, arrays are dynamic by nature. Dimensioning
the array on initialization is not only unnecessary, but also error-prone.
Particularly a number as sole constructor argument may cause an array with
two undefined elements to be created in one implementation, and an array
with one element of type "number" with value 2 in another.
var status = new Array();

function getRadios( paramform )
{
for( var iElement=0; iElement<paramform.elements.length; iElement++ )
{
if( paramform.elements[iElement].checked )
{
temp[0] = paramform.elements[iElement].name;
temp[1] = paramform.elements[iElement].value;
status[status.length] = temp;
}
}
}


You look up references far too often which makes the script run slow.
Consider this:

function getRadios(f)
{
if (f && (e = f.elements))
{
for (var iElement = 0, len = e.length; iElement < len; i++)
{
var o = e[iElement];
if (o.checked)
{
status[status.length] = [o.name, o.value];
}
}
}
}

And, as you see, do not use tab chracters for indentation,
especially not when posting code.
<form name="training">
<table>
<tr>
<td>Microsoft Outlook: </td>


Do not use tables for layout purposes alone.
<td>
<input type='radio' name="outlook" value="START"
onClick="getRadios(document.training)"> START
[...]>
</form>


No need for proprietary referencing like `document.training'
and no need for defining the listener for every element. Use
event bubbling instead:

function getRadios(e)
{
var t = (e && e.target) || event.srcElement;
if (t.tagName && t.tagName.toLowerCase() == "input"
&& t.type && t.type.toLowerCase() == "radio")
{
if (t.checked)
{
status[status.length] = [t.name, t.value];
}
}
}

<form ... onclick="getRadios(event)">
...
</form>

But the problem with your code and even with my code is that you always
add elements to the array, even if the required data is already added.
This looks like a problem suited more for Object objects instead of Array
objects, but why do you think you need to store the values in an array
although already stored in DOM objects in the first place?
PointedEars


maybe it could be solved by using hashes(associative arrays), instead of
status[status.length] = [t.name, t.value];
one could do
status[name]=value;
so that status always keeps selected values from each name group, no duplicates..
Jul 23 '05 #5
On 3 Aug 2004 17:14:19 -0700, tabonni <ta*****@yahoo.com> wrote:
My purpose on storing each radio name and value into an array is for
me to set the cookie easier (I think).

My idea is:
I got a form with different radio button groups. After the user check
the radio values, I will store names and values into a 2D array. For
example: the user check "outlook, start" and "word, completed", I will
put it into status[0][0]=outlook, status[0][1]=start,...

Then, I can put them into cookie like: Use a for..loop and setCookie(
status[name], status[value]); And later on, I can get the data in the
cookie and display on the form again.


[snip]

In that case, it might be better to change that 2D array to a single
dimensioned array and use an object to hold the name/value pairs:

function Pair(n, v) {
this.name = n;
this.value = v;
}

status[0] = new Pair('outlook', 'start');
status[1] = new Pair('word', 'completed');
// ...
for(var i = 0, n = status.length; i < n; ++i) {
setCookie(status[i].name, status[i].value);
}

Much cleaner and easier to understand.

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail
Jul 23 '05 #6
Michael Winter wrote:
<snip>
status[0] = new Pair('outlook', 'start');

<snip>

As an observation in passing, the global variable identifier - status -
corresponds with the - status - property of the window object. As -
window.status - is one of those properties with an overloaded setter
assigning an Array to the property might just have the Array
type-converted to a string and the result displayed in the window's
status bar. And attempts to read the property might be returning a
string primitive, subsequently type-converted to a String object when
used with bracket notation property accessors, allowing assignment to
properties of that (transient) String object, and reading (undefined)
values from it, without error but to no effect.

It might be that the global - var - declaration would avoid the problem
in some browsers, but not according to ECMA 262, where section 10.1.3
reads "If there is already a property of the Variable object with the
name of a declared variable, the value of the property and its
attributes are not changed.", in the context of variable instantiation.
(The global object is used as the "Variable" object in global execution
contexts.)

Richard.
Jul 23 '05 #7
On Wed, 4 Aug 2004 14:11:59 +0100, Richard Cornford
<Ri*****@litotes.demon.co.uk> wrote:
Michael Winter wrote:
<snip>
status[0] = new Pair('outlook', 'start');

<snip>

As an observation in passing, the global variable identifier - status -
corresponds with the - status - property of the window object. As -
window.status - is one of those properties with an overloaded setter
assigning an Array to the property might just have the Array
type-converted to a string and the result displayed in the window's
status bar. And attempts to read the property might be returning a
string primitive, subsequently type-converted to a String object when
used with bracket notation property accessors, allowing assignment to
properties of that (transient) String object, and reading (undefined)
values from it, without error but to no effect.

It might be that the global - var - declaration would avoid the problem
in some browsers, but not according to ECMA 262, where section 10.1.3
reads "If there is already a property of the Variable object with the
name of a declared variable, the value of the property and its
attributes are not changed.", in the context of variable instantiation.
(The global object is used as the "Variable" object in global execution
contexts.)


So in other (shorter) words, use a name such as 'state' to avoid any
conflict. :)

Yet another thing I've overlooked today.

Thanks,
Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail
Jul 23 '05 #8
Michael Winter wrote:
<snip>
So in other (shorter) words, use a name such as 'state'
to avoid any conflict. :)

<snip>

Yes, or keep the variable out of the global scope.

Richard.
Jul 23 '05 #9
ivanhoe wrote:
Thomas 'PointedEars' Lahn <Po*********@nurfuerspam.de> wrote [...]:
But the problem with your code and even with my code is that you always
add elements to the array, even if the required data is already added.
This looks like a problem suited more for Object objects instead of Array
objects [...]


maybe it could be solved by using hashes(associative arrays), instead of
status[status.length] = [t.name, t.value];
one could do
status[name]=value;
so that status always keeps selected values from each name group, no duplicates..


You are talking about Object/user-defined objects which I already mentioned
(yet using `status' as identifier is error-prone, there is a property of the
`window'/global object of that name in browsers). ECMAScript/J(ava)Script
has no built-in concept of associative arrays (as e.g. in PHP) or hashes (Perl).

And please, <http://netmeister.org/news/learn2quote.html>.
PointedEars
Jul 23 '05 #10
Thank you all of you.

My previous problem, it seems is solved. I figured out another way to
get values from Radio button and set cookie last night. May be it is a
stupid way. But, it works.

Now, I got another problem. I haven't figure out how can I set the
values in the cookies back to radio form using getCookie() method. My
purpose is after the user close the browser and open a new browser
next time. The previous values are set. And also, I try to put an
onload() method in <body> e.g. <body onload="setForm();". I got an
error "theForm.elements... is null or not a object". Could anyone give
me any suggestions and comments? THANKS IN ADVANCE.

My new code is as follow:

<body>
<script language="javascript">
var theForm;

/**
Store checked values index into storeIndex array
**/
function getSelectedRadio()
{
var storeIndex = new Array();
for( var i=0; i<theForm.elements.length; i++ ){
if( (theForm.elements[i].checked) ||
(theForm.elements[i].defaultChecked) )
storeIndex[storeIndex.length]= i;
}
return storeIndex;
}

function createCookie()
{
var indexArray = new Array();
indexArray = getSelectedRadio();
for( var s=0; s<indexArray.length; s++ )
setCookie( theForm.elements[indexArray[s]].name,
theForm.elements[indexArray [s]].value );
}

function bakeCookie(f)
{
theForm=f;
var yes_or_no = window.confirm( "Are you sure to change your
status?" );
if( yes_or_no == true )
{
createCookie();
}
}

</script>
<form>
<table>

<tr>
<td>Microsoft Outlook: </td>
<td>
<input type='radio' name="outlook" value="START"> START
<input type='radio' name="outlook" value="COMPLETED"> COMPLETED
<input type='radio' name="outlook" value="IN PROGRESS"> INPROGRESS
</td>
</tr>

<tr>
<td>Microsoft Word: </td>
<td>
<input type='radio' name="word" value="START"> START
<input type='radio' name="word" value="COMPLETED"> COMPLETED
<input type='radio' name="word" value="IN PROGRESS"> INPROGRESS
</td>
</tr>
</table>
</form>
</body>


"Richard Cornford" <Ri*****@litotes.demon.co.uk> wrote in message news:<ce*******************@news.demon.co.uk>...
Michael Winter wrote:
<snip>
So in other (shorter) words, use a name such as 'state'
to avoid any conflict. :)

<snip>

Yes, or keep the variable out of the global scope.

Richard.

Jul 23 '05 #11
On Wed, 04 Aug 2004 15:11:10 GMT, "Michael Winter"
<M.******@blueyonder.co.invalid> wrote:
On Wed, 4 Aug 2004 14:11:59 +0100, Richard Cornford
<Ri*****@litotes.demon.co.uk> wrote:
Michael Winter wrote:
<snip>
status[0] = new Pair('outlook', 'start');

<snip>

As an observation in passing, the global variable identifier - status -
corresponds with the - status - property of the window object. As -
window.status - is one of those properties with an overloaded setter
assigning an Array to the property might just have the Array
type-converted to a string and the result displayed in the window's
status bar. And attempts to read the property might be returning a
string primitive, subsequently type-converted to a String object when
used with bracket notation property accessors, allowing assignment to
properties of that (transient) String object, and reading (undefined)
values from it, without error but to no effect.

It might be that the global - var - declaration would avoid the problem
in some browsers, but not according to ECMA 262, where section 10.1.3
reads "If there is already a property of the Variable object with the
name of a declared variable, the value of the property and its
attributes are not changed.", in the context of variable instantiation.
(The global object is used as the "Variable" object in global execution
contexts.)


So in other (shorter) words, use a name such as 'state' to avoid any
conflict. :)

Yet another thing I've overlooked today.

Even though javascript isn't a typed language like vb script/c++ I
find it usefull to put type infront of the variable names

aStatus // an Array
iStatus // an integer
fStatus // a float
bStatus // a boolean
sStatus // a string
oStatus // an object

etc

Some others I put a g_ or a m_ infront as well

eg

g_iStatus
m_iStatus

I use g_ when the variable is declared in a file other than the main
file (eg a constants.js file) and I use m_ for variables declared in
the main file that ain't in functions if a variable is declared in a
function then I don't bother with g_ or m_

g_ = global
m_ = module

Just my little tip.

HTH

Al
Jul 23 '05 #12
Thomas 'Ingrid' Lahn wrote:
Consider this:

function getRadios(f)
{ // Avoid global and undeclared variables where you can!
var e; if (f && (e = f.elements))
{
for (var iElement = 0, len = e.length; iElement < len; i++)
{
var o = e[iElement];
if (o.checked)
{
status[status.length] = [o.name, o.value];
}
}
}
}

Jul 23 '05 #13
tabonni wrote:
My previous problem, it seems is solved. I figured out another way to
get values from Radio button and set cookie last night. May be it is a
stupid way. But, it works.
From what I read it does not seem to work:
Now, I got another problem. I haven't figure out how can I set the
values in the cookies back to radio form using getCookie() method.
Which is? (not a built-in)
[...]
THANKS IN ADVANCE.
Please don't SHOUT.
My new code is as follow:

<body>
<script language="javascript">
This is still invalid. Have you even considered to use
<http://validator.w3.org/>? You cannot expect the DOM
to work with invalid markup.
[...]
[Top post]


Please read the <http://jibbering.com/faq/> and learn how to post.
PointedEars
Jul 23 '05 #14
Harag wrote:
Even though javascript isn't a typed language like vb script/c++ I
find it usefull to put type infront of the variable names

[...]
iStatus // an integer
fStatus // a float


There are no real integers in ECMAScript implementations, all numbers are
floats (read the FAQ, ask Google). I use the prefix "i" only if I expect
the fractional part to be zero. For the other numbers I use "n" as prefix.
Full ACK to the rest of prefixes, I tend to use the same style.
PointedEars
Jul 23 '05 #15
On Sat, 07 Aug 2004 13:15:05 +0200, Thomas 'PointedEars' Lahn
<Po*********@web.de> wrote:
Harag wrote:
Even though javascript isn't a typed language like vb script/c++ I
find it usefull to put type infront of the variable names

[...]
iStatus // an integer
fStatus // a float


There are no real integers in ECMAScript implementations, all numbers are
floats (read the FAQ, ask Google). I use the prefix "i" only if I expect
the fractional part to be zero. For the other numbers I use "n" as prefix.
Full ACK to the rest of prefixes, I tend to use the same style.

Yep, you entirly right, but coming from a VB background I've kept the
habit of using 'i' & 'f' for the numbers, Since starting JavaScript
I've taken the prefix as to meaning exactly what you said, so where I
use 'i' prefix I expect the factional part to be a zero ( or have
zeroed it manually) eg

iAge = parseInt(Response.Request('Age').Item,10);
if (isNAN(iAge)) iAge = 21;

Al.
Jul 23 '05 #16

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

1
by: Michael Albanese | last post by:
I am developing an application to handle my compay's OSHA reporting requirements. Some of the input criteria are technical and narowly defined, so I was trying to prvide what i call "Context...
8
by: shandain | last post by:
Ok, I have done this a million times, and I can't get this to work... I hope I am just being an idiot and missing something... but I can't see it... so please call me an idiot and tell me what it...
4
by: Jared | last post by:
Radio Button or Check Box and Event Procedures I need to insert either radio buttons or check boxes onto my form. I'm not sure which to use, or if there are other options. I am using the buttons...
4
by: Dino Buljubasic | last post by:
Hi, I had to improvise a control that looks like a list view with each row holding 3 radio buttons. To do this I am using a panel (mainPanel) that holds other panels representing rows...
18
by: Ed Jay | last post by:
<disclaimer>js newbie</disclaimer> My page has a form comprised of several radio buttons. I want to poll the buttons to determine which button was selected and convert its value to a string. I...
1
by: David Van D | last post by:
Hi there, A few weeks until I begin my journey towards a degree in Computer Science at Canterbury University in New Zealand, Anyway the course tutors are going to be teaching us JAVA wth bluej...
2
by: Tyla | last post by:
I have been teaching myself javascript and i am having a huge problem with this form. All it has to do is check that every field has something in it and then post, but as soon as it gets to the...
3
by: Abersparky | last post by:
I'm having a problem with multiple radio button groups within a while loop. I have the page made so it pulls from a database the row values - one of which is a Y or N value. I have a radio button...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
0
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
0
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.