onchange not recognized by IE?!?

I have a form that is used for uploading photos. I have a check box for
specifying that the photo being uploaded should appear on a specific
web page rather than just be stored in the database for future posting.
When this check box checked two text boxes should appear in the form
for adding a url. The problem is: internet explorer doesn't seem to be
recognizing the onchange event as I've called it. What am I doing
wrong? Here's the code:

function triggerpages(){
var checks = document.getElementsByTagName('INPUT');
for(var i=0;i<checks.length;i++){
if(/web\-page/.test(checks[i].name)){
checks[i].onchange = function(){showpages();};
}
}
}

function showpages(){
alert("HI");
var pages = document.getElementsByTagName('INPUT');
alert(pages.length);
for(var i=0;i<pages.length;i++){
if(/page[0-9]/.test(pages[i].name)){
if(pages[i].style.display == none){
pages[i].style.display = block;
}else{
pages[i].style.display = none;
}
}
}
}


and the HTML:

<table border="0" cellpadding="10" cellspacing="0" id="upload_form">
<form action="/admin/photos" method="post"
enctype="multipart/form-data">

<tr>
<td>
Image file
</td>
<td>
<input type="file" value="file1" name="file1"
accept="image/jpg,image/gif" />
</td>
</tr>

<tr>
<td valign="top">
Caption
</td>
<td >

<textarea name="caption" cols="60" rows="4"[color=blue]
>Photo.</textarea>[/color]
</td>
</tr>

<tr>
<td valign="top">

Placement
</td>
<td>

<input type="checkbox" name="web-page" checked />
Displayed in web page?
<br>

<input type="checkbox" name="in-index" checked />
Displayed on story index (small thumbnail)?
<br>

<input type="checkbox" name="in-blurb" />
Display thumbnail in home page story description?
<br>

<input type="checkbox" name="in-news-index" />
Displayed as the headline graphic on the news index?
<br>

<input type="checkbox" name="in-home-rotate" />
Photo rotation on home page?
<br>
</td>
</tr>
<tr class="page_entry">
<td>URL</td>

<td><input type="text" name="page1" value="" /></td>
</tr>
<tr class="page_entry">
<td>URL</td>
<td><input type="text" name="page2" value="" /></td>
</tr>
<tr>
<td align="center" colspan="2">

<input type="submit" value="Upload" name="submit" />
</td>
</tr>

</form>
</table>
<script language="javascript">
<!--
triggerpages();
//-->
</script>

re: onchange not recognized by IE?!?

otto wrote:

[color=blue]
> var checks = document.getElementsByTagName('INPUT');
> for(var i=0;i<checks.length;i++){
> if(/web\-page/.test(checks[i].name)){
> checks[i].onchange = function(){showpages();};[/color]
[color=blue]
> <input type="checkbox" name="web-page" checked />
> Displayed in web page?[/color]

IE's documentation is here
<http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/events/onchange.asp>
If you want an event handler on a checkbox that is triggered when the
checkbox is checked or unchecked then use onclick.


--

Martin Honnen
http://JavaScript.FAQTs.com/

re: onchange not recognized by IE?!?

Thanks for your reply. That does seem to do the trick. I've been trying
to steer clear of onclick for accessibility reasons, but I guess I'll
get around that by using an onkeypress event too.

Thanks again.