By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
424,854 Members | 2,015 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 424,854 IT Pros & Developers. It's quick & easy.

<input type="image" ... does not show up as a form element! why?

P: n/a
Hi all,

I was trying to make an image submit button with a rollover and discovered
to my suprise that there is no way to access a form element of the "image"
type. I tried specifying it by name and also by the elements[] array with
no luck.
Even weirder, I can sandwich an image button in between other input types
and then write a script diplaying the contents of the elements array and it
acts as if the image button does not exist at all!
For example the following:
<input type="text" ... > : this is elements[0]
<input type="checkbox" ...> : this is elements[1]
<input type="image" ...> : this does not exist!
<input type="text" ...> : this is elements[2]

Does anyone know of any way to access (or set) the properties of an image
input type?
I ask, because I wanted to have a rollover action on a button that also can
POST a form WITHOUT using submit() - in order that non-Javascript enabled
browsers can fail gracefully (i.e. the form is still POSTed).
TIA!
MC Dave
Jul 23 '05 #1
Share this Question
Share on Google+
1 Reply


P: n/a
Solution:
Because the "image button" is not accessible via the elements collection nor
by directly naming it (i.e. forms[0].elements[5] OR myform.BTNcontinue)
BUT you can utilize "this" to change a property directly as in the example
below where a rollover can be specified directly:

<INPUT TYPE="image" name="BTNcontinue"
src="images/buttons/btncontinueshopping.gif"
onmouseover="this.src='images/buttons/btncontinueshopping_f2.gif'"
onmouseout="this.src='images/buttons/btncontinueshopping.gif'">

To reference it from an outside script:
<INPUT TYPE="image" name="BTNcontinue"
src="images/buttons/btncontinueshopping.gif" onmouseover="rollon(this);"
onmouseout="rolloff(this);">

<script language="JavaScript">

function rollon(myref)
{
myref.src='images/buttons/btncontinueshopping_f2.gif';
}

function rolloff(myref)
{
myref.src='images/buttons/btncontinueshopping.gif';
}

</script>

"Dave" <dave(delete_this)@miraclecatDELETETHISTOO.com> wrote in message
news:V_Xdc.4287$xn4.17460@attbi_s51...
Hi all,

I was trying to make an image submit button with a rollover and discovered
to my suprise that there is no way to access a form element of the "image"
type. I tried specifying it by name and also by the elements[] array with
no luck.
Even weirder, I can sandwich an image button in between other input types
and then write a script diplaying the contents of the elements array and it acts as if the image button does not exist at all!
For example the following:
<input type="text" ... > : this is elements[0]
<input type="checkbox" ...> : this is elements[1]
<input type="image" ...> : this does not exist!
<input type="text" ...> : this is elements[2]

Does anyone know of any way to access (or set) the properties of an image
input type?
I ask, because I wanted to have a rollover action on a button that also can POST a form WITHOUT using submit() - in order that non-Javascript enabled
browsers can fail gracefully (i.e. the form is still POSTed).
TIA!
MC Dave

Jul 23 '05 #2

This discussion thread is closed

Replies have been disabled for this discussion.