Help with loop/naming elements | | |
<disclaimer>New to js.</disclaimer>
I have several pages, each with menues comprising checkboxes or radio
boxes within the same form. I presently 'brute force' clear the buttons
with individual scripts for each form, e.g.:
function clearLa() {
window.document.form1.button1La.checked=false;
window.document.form1.button2La.checked=false;
window.document.form1.button3La.checked=false;
window.document.form1.button4La.checked=false;
window.document.form1.button5La.checked=false;
}
Another set of buttons in the same form might be call, e.g., button1Ra et
seq.
I tried to simplify the above with a simple loop:
var counter = 1;
function clearLa() {
while (counter < 6) {
window.document.form1.button[counter]La.checked=false;
counter++;
}
}
But it seems to go into an infinite loop. Where am I going wrong?
I would ultimately like to have a single generic routine that I can pass
the number of buttons in the menu as well as the name of the button set
(e.g., buttonLa, buttonXz, etc. So, for a set of 8 buttons called
buttons1xy, button2xy...button8xy, I can write something like
'onClick = "clearButtons(xy,8).' How do I do it?
--
Ed Jay (remove M to respond by email) | | | | re: Help with loop/naming elements
Well, try ->
function toggleAll(el, state) {
for (i=0;i<el.length;i++)
el[i].checked=state;
}
-----------------------------------------------------------
<form name="SOMETHING">
<input type="radio" name="DUCKS" value="1">
<input type="radio" name="DUCKS" value="2">
<input type="radio" name="DUCKS" value="3">
<input type="radio" name="DUCKS" value="4">
<input type="checkbox" name="DOVES" value="1">
<input type="checkbox" name="DOVES" value="2">
<input type="checkbox" name="DOVES" value="3">
<input type="checkbox" name="DOVES" value="4">
.....
<input type="button" onclick="toggleAll(this.form.DUCKS,
false)" value="unchek all ducks">
<input type="button" onclick="toggleAll(this.form.DUCKS,
true)" value="chek all ducks">
<input type="button"
onclick="toggleAll(this.form.DOVES, false)" value="unchek all doves">
<input type="button"
onclick="toggleAll(this.form.DOVES, true)" value="chek all doves">
</form>
Danny | | | | re: Help with loop/naming elements
Lee <REM0VElbspamtrap@cox.net> wrote:
[color=blue]
>Ed Jay said:[color=green]
>>
>><disclaimer>New to js.</disclaimer>
>>
>>I have several pages, each with menues comprising checkboxes or radio
>>boxes within the same form. I presently 'brute force' clear the buttons
>>with individual scripts for each form, e.g.:
>>
>> function clearLa() {
>> window.document.form1.button1La.checked=false;
>> window.document.form1.button2La.checked=false;
>> window.document.form1.button3La.checked=false;
>> window.document.form1.button4La.checked=false;
>> window.document.form1.button5La.checked=false;
>>}
>>
>>Another set of buttons in the same form might be call, e.g., button1Ra et
>>seq.
>>
>>I tried to simplify the above with a simple loop:
>>
>>var counter = 1;
>>function clearLa() {
>>while (counter < 6) {
>>window.document.form1.button[counter]La.checked=false;
>>counter++;
>>}
>>}
>>
>>But it seems to go into an infinite loop. Where am I going wrong?
>>
>>I would ultimately like to have a single generic routine that I can pass
>>the number of buttons in the menu as well as the name of the button set
>>(e.g., buttonLa, buttonXz, etc. So, for a set of 8 buttons called
>>buttons1xy, button2xy...button8xy, I can write something like
>>'onClick = "clearButtons(xy,8).' How do I do it?[/color]
>
>I don't believe your code goes into an infinite loop, but it's not
>going to do what you want, either.
>Although it's not causing problems, you really should initialize your
>"counter" variable inside the function.
>The important point you've missed is that when referring to form
>elements using square-bracket notation, the bracket must contain
>the entire name of the element, not just the variable part:
>
> document.form1.elements["button"+counter+"La"].checked=false;
>[/color]
Thanks. As you can see from the header, I suspected as much.[color=blue]
>
>function clearButtons(suffix,count) {
> while (count) {
> document.form1.elements["button"+(count--)+suffix].checked=false;
> }
>}
>
>called as:
>
> onclick = "clearButtons('La',8)"[/color]
This appears to be exactly what I'm trying to do. Thanks.[color=blue]
>
>
>There are alternatives, such as naming all 8 buttons "buttonLa"
>and allowing the browser to build the array for you:
>
> function clearButtons(suffix) {
> for(var i=0;i<document.form1.elements["buttons"+suffix].count) {
> document.form1.elements["button"+suffix][i].checked=false;
> }
> }
>
>
>[/color]
--
Ed Jay (remove M to respond by email) | | | | re: Help with loop/naming elements
Danny <dann90038@bluebottle.com> wrote:
[color=blue]
> Well, try ->
>
>
> function toggleAll(el, state) {
> for (i=0;i<el.length;i++)
> el[i].checked=state;
> }
>
>-----------------------------------------------------------
>
> <form name="SOMETHING">
>
> <input type="radio" name="DUCKS" value="1">
> <input type="radio" name="DUCKS" value="2">
> <input type="radio" name="DUCKS" value="3">
> <input type="radio" name="DUCKS" value="4">
> <input type="checkbox" name="DOVES" value="1">
> <input type="checkbox" name="DOVES" value="2">
> <input type="checkbox" name="DOVES" value="3">
> <input type="checkbox" name="DOVES" value="4">
> .....
>
> <input type="button" onclick="toggleAll(this.form.DUCKS,
>false)" value="unchek all ducks">
> <input type="button" onclick="toggleAll(this.form.DUCKS,
>true)" value="chek all ducks">
> <input type="button"
>onclick="toggleAll(this.form.DOVES, false)" value="unchek all doves">
> <input type="button"
>onclick="toggleAll(this.form.DOVES, true)" value="chek all doves">
>
> </form>
>
>[/color]
Thanks, Danny. This is simple and elegant.
--
Ed Jay (remove M to respond by email) | | | | re: Help with loop/naming elements
Ed Jay <edMbj@aes-intl.com> wrote:
[color=blue]
><disclaimer>New to js.</disclaimer>
>[/color]
I've progressed to a state of frustration.
I select one of 6 radio buttons. Each has the same name, but different
values. When a button is selected, an onClick function brings up another
menu. I want the second menu to use a string returned from the js
function.
The js:
var s= [
'uniform Thermal Pattern',
'regular thermovascular pattern',
'thermovascular network',
'irregular thermovascular pattern',
'distorted thermovascular pattern',
'anarchic thermovascular pattern'
]
function checkRadio(field) {
for(var i=0; i < field.length; i++)
if(field[i].checked)
alert("Alert in loop: " + s[i]);
document.write(s[i]);
return s[i];
}
I want to use the returned string as part of a dynamic sentence. E.g,
'The
<script type="text/javascript>
checkRadio(buttonName);document.write(s[i])
</script>
and more text.
I've also tried document.write(checkRadio(buttonName);
I'm executing the script up to "return s[i];" If I put an alert after the
function call, I get the alert.
Besides trying to write in a language I don't understand, where have I
gone wrong in the above?
TIA,
--
Ed Jay (remove M to respond by email) | | | | re: Help with loop/naming elements
Ed Jay wrote:[color=blue]
> Ed Jay <edMbj@aes-intl.com> wrote:
>
>[color=green]
>><disclaimer>New to js.</disclaimer>
>>[/color]
> I've progressed to a state of frustration.
>
> I select one of 6 radio buttons. Each has the same name, but different
> values. When a button is selected, an onClick function brings up another
> menu. I want the second menu to use a string returned from the js
> function.
>
> The js:
>
> var s= [
> 'uniform Thermal Pattern',
> 'regular thermovascular pattern',
> 'thermovascular network',
> 'irregular thermovascular pattern',
> 'distorted thermovascular pattern',
> 'anarchic thermovascular pattern'
> ]
>
> function checkRadio(field) {
> for(var i=0; i < field.length; i++)
> if(field[i].checked)
> alert("Alert in loop: " + s[i]);
> document.write(s[i]);
> return s[i];
> }
>
> I want to use the returned string as part of a dynamic sentence. E.g,
>
> 'The
> <script type="text/javascript>
> checkRadio(buttonName);document.write(s[i])[/color]
Your checkRadio function returns the index, so the call to checkRadio
replaces the index 'i':
document.write(s[checkRadio(buttonName)]);
[color=blue]
> </script>
> and more text.
>
> I've also tried document.write(checkRadio(buttonName);[/color]
Close, but no cigar... you forgt the 's'. Alternatively, have
checkRadio return s[i], then the above line will work provided you fix
the syntax error.
document.write(checkRadio(buttonName));
// note additional closing bracket---^
[...]
--
Rob | | | | re: Help with loop/naming elements
RobG <rgqld@iinet.net.au> wrote:
[color=blue]
>Ed Jay wrote:[color=green]
>> Ed Jay <edMbj@aes-intl.com> wrote:
>>
>>[color=darkred]
>>><disclaimer>New to js.</disclaimer>
>>>[/color]
>> I've progressed to a state of frustration.
>>
>> I select one of 6 radio buttons. Each has the same name, but different
>> values. When a button is selected, an onClick function brings up another
>> menu. I want the second menu to use a string returned from the js
>> function.
>>
>> The js:
>>
>> var s= [
>> 'uniform Thermal Pattern',
>> 'regular thermovascular pattern',
>> 'thermovascular network',
>> 'irregular thermovascular pattern',
>> 'distorted thermovascular pattern',
>> 'anarchic thermovascular pattern'
>> ]
>>
>> function checkRadio(field) {
>> for(var i=0; i < field.length; i++)
>> if(field[i].checked)
>> alert("Alert in loop: " + s[i]);
>> document.write(s[i]);
>> return s[i];
>> }
>>
>> I want to use the returned string as part of a dynamic sentence. E.g,
>>
>> 'The
>> <script type="text/javascript>
>> checkRadio(buttonName);document.write(s[i])[/color]
>
>Your checkRadio function returns the index, so the call to checkRadio
>replaces the index 'i':
>
>
>[/color]
I edited my calling code to that as shown, above. I changed the Return
statement from 'return s[i];' to 'return 'i;' It still doesn't work.[color=blue]
>[color=green]
>> </script>
>> and more text.
>>
>> I've also tried document.write(checkRadio(buttonName);[/color]
>
>Close, but no cigar... you forgt the 's'. Alternatively, have
>checkRadio return s[i], then the above line will work provided you fix
>the syntax error.[/color]
How?[color=blue]
>
> document.write(checkRadio(buttonName));
> // note additional closing bracket---^
>[/color]
For troubleshootong purposes, I rewrote radioCheck() as
function checkRadio(field) {
for(var i=0; i < field.length; i++)
if(field[i].checked)
document.write(s[i]);
document.write(i);
return i;
}
When called inline with:
<script type="text/javascript>
document.write(s[checkRadio(buttonName)]);
alert("Made it");
</script>
A new otherwise blank window appears with the correctly indexed string
followed by the index, 'i.' I do not get the alert. More interesting (to
me), when called, the function prints the correctly indexed string, but
the index always shows as 1 more than the array length. This tells me that
the loop progresses until it finds the checked radio button, prints s[i],
and continues to count through all values of i until it reaches the limit.
Playing around, I changed the loop to read:
function checkRadio(field) {
for(var i=0; i < field.length; i++)
if(field[i].checked) {ppp = i;
document.write(s[i]);
document.write(i);
document.write(ppp);
return i;
}
}
I still don't get the returned value, but the function at least shows the
correct index value and correct ppp. By this I mean that if I select
Button 3, the new window shows s[i] = s[3] and both i and ppp are written
as 3.
Regardless, I don't seem to be getting past the 'return i;' statement as
the alert following the code call isn't triggered.
--
Ed Jay (remove M to respond by email) |  | Similar JavaScript / Ajax / DHTML bytes | | | /bytes/about
We are a network of experts and professionals in IT and software development that help one another with answers to tough questions and share insights.
Get the best answers to your questions from over 226,510 network members.
|