Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to remove x and y on submit in HTML form with Image type button?

I have created a form in my application as follows:

<form action="/search/" method="get">    <input id="search-box" name="search" type="text" size=30 title="Search" value="" />    <input id="search-submit" type="image" alt="Search" src="/images/search-button.gif" />  </form> 

But when I am submitting my form then URL is created as below:

mysitename.com/search/?search=hello&x=0&y=0 

Can anyone please tell me why this x and y is coming in my URL. On more thing instead of image button if I am changing my form code as below then its working fine,

<form action="/search/" method="get">    <input id="search-box" name="search" type="text" size=30 title="Search" value="" />    <input id="search-submit" type="submit" value="Search"/>  </form> 

but I need an image button to make my form look good. Please tell me how to remove these x and y parameteres from URL.

like image 316
djmzfKnm Avatar asked Apr 29 '09 10:04

djmzfKnm


People also ask

Can you use an image as a submit button?

Definition and UsageThe <input type="image"> defines an image as a submit button. The path to the image is specified in the src attribute.

How do I change the submit button text in HTML?

Input value attribute The value attribute can be used to change the text of the form submit button. Use value attribute within <input> of type="submit" to rename the button.

How do I make an image a button in HTML?

The image buttons in the HTML document can be created by using the type attribute of an <input> element. Image buttons also perform the same function as submit buttons, but the only difference between them is that you can keep the image of your choice as a button.


2 Answers

You'll always get mouse co-ordinates for a submit button type="image"

You can use a standard submit type button and just apply styles to it to change the look.

<input type="submit" id="search-submit" value=""     style="background-image: url(/images/search-button.gif); border: solid 0px #000000; width: WIDTHpx; height: HEIGHTpx;" /> 
like image 125
Eoin Campbell Avatar answered Sep 18 '22 12:09

Eoin Campbell


They are the mouse coordinates of the click. I don't believe there's any way to prevent them - if you use an <input type='image'> then you get them. Why is it a problem? Can't you just ignore them?

Answering Prashant's comment: Digg are adding an onclick handler to the <input> (or possibly an onsubmit handler to the form) which builds the neat-looking search URL and redirects the browser to that URL, and then returns false to prevent the <input> from submitting the form itself. If you turn off JavaScript you'll see that you do get the x and y parameters in the URL. Clever!

like image 30
RichieHindle Avatar answered Sep 17 '22 12:09

RichieHindle