Onclick Submit form Javascript with image buttons

hey, well I have this form

    <form method="POST" action=''>
<input type="hidden" name="op" value="download1">
<input type="hidden" name="usr_login" value="<TMPL_VAR usr_login>">
<input type="hidden" name="id" value="<TMPL_VAR file_code>">
<input type="hidden" name="fname" v开发者_StackOverflowalue="<TMPL_VAR file_name>">
<input type="hidden" name="referer" value="<TMPL_VAR referer>">
<div class="premium-download"><input name="method_premium" value="<TMPL_VAR lang_premium_download>" type="image" src="images/premium-download.png" alt="<TMPL_VAR lang_premium_download>" border="0" /></div>
<div class="free-download"><input name="method_free" value="<TMPL_VAR lang_free_download>" type="image" src="images/free-download.png" alt="<TMPL_VAR lang_free_download>" /></div>
</form>

How can I submit the form from the image inputs (see the last two fields)? Right now they are set as image type and I understand that those will not submit the form by default. Could anyone help? I was told to do it with javascript :D

I initially misread your question. As already noted, <input type="image"> elements do submit forms. However, if you're looking for more versatility than image inputs, my answer still applies.

I was told to do it with javascript

Don't, use <button> elements instead. <button> elements work like <input type="button">, except that they can be styled to have no border, be transparent, and they can contain other HTML. For example:

<button type="submit" name="method_premium" value="<TMPL_VAR lang_premium_download>">
  <img src="images/premium-download.png" alt=alt="<TMPL_VAR lang_premium_download>" />
</button>

Style the button with CSS (border:none; background-color:transparent;) and you're good to go.

Buttons created with the BUTTON element function just like buttons created with the INPUT element, but they offer richer rendering possibilities: the BUTTON element may have content. For example, a BUTTON element that contains an image functions like and may resemble an INPUT element whose type is set to "image", but the BUTTON element type allows content.

• The BUTTON Element - W3C

Input elements with "type" set to "image" do indeed act (almost) exactly like "submit" inputs. It's "almost" exactly because you also get the coordinates of the mouse click, and you don't get the "value" of the input element.

If you wanted the clicks on the "image" inputs to submit the values, the simplest thing to do would be to have a couple more hidden inputs.

I don't know what you are trying to achieve, but you could submit the form using JavaScript. It might be best to use the BUTTON as suggested by @Andy E:

<form method="POST" name='myForm'>   
...
...


<script lang="javascript">
function SubmitForm()
{
  document.forms['myForm'].submit() ;
}
</script>