IE 7 document.getElementById() error

**jay_rad** · 01-29-2007, 06:44 PM

I'm only getting the error in IE 7:

"A Runtime Error has occured.
Do You Wish to Debug?

Line: 150
Error: Object doesn't support this property or method."

This is my Javascript function:

Code:

function updateTotal(i, b) {
	// Declare the HTML
	totalHTML=i;
	// Find the table cell
	total=document.getElementById('total'); // THIS IS LINE 150
	// Enter the HTML into the cell
	total.innerHTML=totalHTML;
	document.dayPlacement.subTotal.value=b;
}

I know it's a valid Id:

Code:

<tr>			
	<td height="47"></td>
	<td><b>Sub - Total:</b></td>
	<td><div align="right"><b id="total">0.00</b></div></td>
</tr>

I'm drawing a complete blank. Any help would be had. Also, it works just as expected in FireFox

**mburt** · 01-29-2007, 07:25 PM

Where is the script located?
If it's:

In the head, it's fine
In the body above the div, it won't work. It won't have any properties. The div must be defined first.
In the body below the div, should be fine

Hope that helps. Let us know if you have any more problems.

**Twey** · 01-29-2007, 08:01 PM

In the head, it's fine

Code in the head is executed before any of the body is loaded.

You must make sure that the <div> exists before doing anything with it. Where do you call this function?
Also:

Code:

        document.dayPlacement.subTotal.value=b;

This is highly non-standard. Use:

Code:

document.forms['dayPlacement'].elements['subTotal'].value = b;

**mburt** · 01-29-2007, 08:04 PM

Code in the head is executed before any of the body is loaded.

Yes, but when the code is within a function, it is ignored until called. So basically it reads the DIV before the function.
Even if you called the function:

Code:

window.onload = function() {updateTotal(i value,b value);}

It would still work.

**Twey** · 01-29-2007, 08:30 PM

As I said, depending on where the function is called. Calling it onload like that is fine, but it could be called in the global scope in the head, or in the body before the <div> has been loaded.

**jay_rad** · 01-29-2007, 09:32 PM

Originally Posted by Twey

Code in the head is executed before any of the body is loaded.

You must make sure that the <div> exists before doing anything with it. Where do you call this function?

It's called in the body, as an onChange event handler

Also:

Code:

        document.dayPlacement.subTotal.value=b;

This is highly non-standard. Use:

Code:

document.forms['dayPlacement'].elements['subTotal'].value = b;

Sorry bout that... pretty new to JS, I'll change that over and start doing it that way.

Originally Posted by mburt

Where is the script located?
If it's:

In the head, it's fine
In the body above the div, it won't work. It won't have any properties. The div must be defined first.
In the body below the div, should be fine

Hope that helps. Let us know if you have any more problems.

Right now it's in the body above the Div, but I changed it to the body below the Div and it still isn't working... same error.

**mburt** · 01-29-2007, 09:33 PM

They way you had it first should work...
I think we've realized that it isn't the problem. Maybe a bug in IE? I'm not sure.

**jay_rad** · 01-29-2007, 09:37 PM

Even when I tell IE to ignore this JS problem, it comes up with another, exact same thing. Elsewhere in the page I tell it to change the contents of a certain element, using the getElementById() function, but it doesn't work, same error.