problems referencing checkbox using ID tag

[snakeeyes1978]

I have a problem with the following code. It keeps coming back saying - "Error: 'Ballarat' is undefined. When the function is triggered. When I view the source, however, Ballarat is clearly defined.

Any ideas?


function select_all() {

if (document.SWorks.All.checked == true) {
blah = Ballarat;
document.getElementById(blah).checked = true;
} else {
blah = Ballarat;
document.SWorks.getElementById(blah).checked = false;
}

<INPUT type='checkbox' id='Ballarat' name='{16604C2B-FFAF-49F9-A583-EF33C3956D22}'>
<INPUT type='checkbox' name='All' onclick="select_all()"> All</input>

 

[BillyRayPreachersSon]

You need to surround Ballarat in quotes to turn it into a string:

blah = 'Ballarat';

Incidentally, to avoid confusion for IE, you should avoid giving any element an ID of "All".

Hope this helps,
Dan

 

[snakeeyes1978]

Thanks Dan, now it comes back with the error saying "Object doesn't support this property or method

 

[trollacious]

You're pushing it with the name for the Ballerat checkbox. Form elements have restrictions on what characters they can have in them, and what they can start with. The short answer is that the first character must be a letter, and any other characters may be a letter, a digit, ".", or "-". If that's not causing a problem yet, it will.

Lee

 

[trollacious]

Here's the W3C URL for nameing conventions:

http://www.w3.org/TR/html4/types.html#type-cdata

Lee

 

[jjbrad]

The following works here:

function select_all() {

if (document.form1.A.checked == true) {
blah = 'Ballarat';
document.getElementById(blah).checked = true;
} else {
blah = 'Ballarat';
document.getElementById(blah).checked=false;
}
}

<INPUT type='checkbox' id='Ballarat' name='B'>
<INPUT type='checkbox' name='A' onclick="select_all()"> All</input>


(note: the form name on my test is "form1")

On your second "document.get...", you referenced the form;

document.SWorks.getElementById(blah).checked

instead, just reference the document object directly (like you did on your first one)

document.getElementById(blah).checked



------------------
Note: You could also pass the object that is used on your "if" statement. I believe this would be more efficient since the browser wouldn't have to scan all objects to find the right one - and the code will be useful in more situations (like within tables). For example:

function select_all(objThis) {

if (objThis.checked == true) {
.
.
.
<INPUT type='checkbox' id='Ballarat' name='B'>
<INPUT type='checkbox' name='A' onclick="select_all(this)"> All</input>