input image submits x,y

[jshanman]

Here is my issue:

I have a form that submits a search using the GET method (for
bookmarking purposes) but the form has an <input type='image'...>
element for the submit button to make it pretty. When this submits,
it also submits the ?x=10&y=15 garbage into the url which makes it
ugly. Is there any simple way to avoid this without resorting to
javascript initiating the script?

 

[Adrienne Boswell]

Gazing into my crystal ball I observed jshanman <[email protected]>
writing in @z66g2000hsc.googlegroups.com:

Here is my issue:

I have a form that submits a search using the GET method (for
bookmarking purposes) but the form has an <input type='image'...>
element for the submit button to make it pretty. When this submits,
it also submits the ?x=10&y=15 garbage into the url which makes it
ugly. Is there any simple way to avoid this without resorting to
javascript initiating the script?

There is no way to do this in HTML, but you could always change it to
submit and use CSS to style it, eg:

input.submit {background-image: url(button.gif};}

<input type="submit" class="submit" value="Submit">

 

[jshanman]

Gazing into my crystal ball I observed jshanman <[email protected]>
writing in @z66g2000hsc.googlegroups.com:



There is no way to do this in HTML, but you could always change it to
submit and use CSS to style it, eg:

input.submit {background-image: url(button.gif};}

<input type="submit" class="submit" value="Submit">

Perfect, thanks! I hadn't thought of setting background css on an
input button/submit element.

- jshanman

 

[jshanman]

Perfect, thanks!  I hadn't thought of setting background css on an
input button/submit element.

- jshanman

Actually it turns out that IE doesn't like a background-image property
on a submit element. Oh well :/

 

[Adrienne Boswell]

Gazing into my crystal ball I observed jshanman <[email protected]>
writing in (e-mail address removed):

submits

Actually it turns out that IE doesn't like a background-image property
on a submit element. Oh well :/

Yes, it does. Do you have a URL where it does not work? I have one
that does:
http://www.cavalcade-of-coding.info/testinput.html

 

[jshanman]

Gazing into my crystal ball I observed jshanman <[email protected]>
writing in (e-mail address removed):







Yes, it does.  Do you have a URL where it does not work?  I have one
that does:http://www.cavalcade-of-coding.info/testinput.html

IE didn't like my border: none that I had defined in the same
element.style

Didn't work in IE:
<input type="submit" style="background-image: url(btn_go.gif); width:
54px; height: 24px; border: none;" value="" class="searchButton" />

Works OK:
<input type="submit" style="background-image: url(btn_go.gif); width:
54px; height: 24px; border: 0px;" value="" class="searchButton" />

Thanks,
- jshanman

 

[Adrienne Boswell]

Gazing into my crystal ball I observed jshanman <[email protected]>
writing in (e-mail address removed):

t

IE didn't like my border: none that I had defined in the same
element.style

Didn't work in IE:
<input type="submit" style="background-image: url(btn_go.gif); width:
54px; height: 24px; border: none;" value="" class="searchButton" />

Works OK:
<input type="submit" style="background-image: url(btn_go.gif); width:
54px; height: 24px; border: 0px;" value="" class="searchButton" />

Thanks,
- jshanman

Inline style like that is a bad idea, better to put it into an external
style sheet. That way, you don't have to go hunting around if your
client wants to change it later.

 

[jshanman]

Gazing into my crystal ball I observed jshanman <[email protected]>
writing in (e-mail address removed):










Inline style like that is a bad idea, better to put it into an external
style sheet.  That way, you don't have to go hunting around if your
client wants to change it later.

Thanks for the advice. I'm glad I thought of it. I just put them
inline for example purposes.

- jshanman

 

[mynameisnobodyodyssea]

I think that you still have the problem
that you cannot specify the text for the
submit button, for example lynx will give
the default value Submit if you have
<input type="submit" value="" class="something" />
that is OK I suppose if you do not want a
different text.
With an image button you can specify the text
of the button with the alt attribute.

I think that if you do not like the
x=value&y=value in the query string,
it is better to have a submit button
without an image, you can
make it prettier by setting the
colour and font of the text in the stylesheet.