Input Type image submit form value

Question

I am using this code to try and submit a value via form but it doesn t seem to submit anything     I would normally use a checkbox or Radio buttons for multiple options but I want to use an image to do this   Is this code wrong    lt input id  test1  name  test1  type  image  src  images f jpg  value  myValue  alt      gt    So I want to pass the value in value  myValue     The form works fine so that s not the problem  I just need help with the input part not submitting as I know that works   Thanks

User · Answer

Here is what I was trying to do and how I did it. I think you wanted to do something similar. I had a table with several rows and on each row I had an input with type image. I wanted to pass an id when the user clicked that image button. As you noticed the value in the tag is ignored. Instead I added a hidden input at the top of my table and using javascript I put the correct id there before I post the form.

<input type="image" onclick="$('#hiddenInput').val(rowId) src="...">

This way the correct id will be submitted with your form.

User · Answer

To submit a form you could use    lt input type  submit  gt    or   lt input type  button  gt    Javascript    I never heard of such a crazy guy to try to send a form using a image or a checkbox as you want

User · Answer

An input type  quot image quot  only defines that image as the submit button and not as an input that can carry over a value to the server

User · Answer

well if i was in your place i would do this I would have an hidden field and based on the input image field i would change the hidden field value jQuery   and then finally submit the hidden field whose value reflects the image field

User · Answer

Solution    lt form name  frmSeguimiento  id  frmSeguimiento  method  post  action  proc seguimiento php  gt         lt input type  hidden  name  accion  id  accion   gt     lt input name  save  type  image  src  imagenes save png  alt  Save  onmouseover  this src  imagenes save over png    onmouseout  this src  imagenes save png    value  Save  onclick  validaFrmSeguimiento this value     gt    function validaFrmSeguimiento accion        document frmSeguimiento accion value accion       Regards  jp

User · Answer

I ve found that image-buttons DO return a response  but you should NOT use a value-option  What I see returned are two version of the name  MYNAME  with  X and  Y endings    For example    lt input type  image  src   path-to stop png  name  STOP  width  25  height  25  align  top  alt  Stop sign  gt    This is within your  lt form gt  to  lt  form gt    If you click the image  what s returned are STOP X and STOP Y with numeric values  The existence of either indicates the STOP image-button was clicked   You don t need any special code  Just treat it as another kind of  submit  button that returns a pair of augmented NAMEs   I ve tried this on Safari  Firefox and Chrome  The image wasn t displayed with Safari  but where it was supposed to be located  my cursor turned into a finger-icon  and I could click it

User · Answer

You could use a radio button checkbox and set it to hide the button in css and then give it a label with an image   input type  radio    display  none  input type  radio     label span  display  block    Then on the page    lt input type  radio  name  emotion  id  mysubmitradio    gt           lt label for  mysubmitradio  gt  lt img src  images f jpg    gt       lt span gt if you need it lt  span gt  lt  label gt    And then set it to submit using javascript   document forms  myform   submit

User · Answer

Inputs of type  image  don t send their name value pair when used to submit the form  To me  that sounds like a bug  but that s how it is   To get around this  you can replace the input with a button of type  submit   and put a img element inside   Unfortunately  that causes your image to be in a ugly HTML  button   However  assuming you aren t using the standard HTML button anywhere  you can just override the stylesheet  and then everything should work as expected    x000D   x000D  button  input type  submit    input type  reset     x000D   background  none  x000D   color  inherit  x000D   border  none  x000D   padding  0  x000D   font  inherit  x000D   cursor  pointer  x000D   outline  inherit  x000D    x000D   lt form action   post  gt  x000D   lt input name  test  gt  x000D   lt button type  submit  name  submit button  value  submitted  gt  x000D   lt img src  https   via placeholder com 32  alt  image  gt  x000D   lt  button gt  x000D   lt  form gt  x000D   x000D   x000D

User · Answer

Add this      name  myvalue    To your  tag

User · Answer

Some browsers  IIRC it is just some versions of Internet Explorer  only send the co-ordinates of the image map  in name x and name y  and ignore the value  This is a bug   The workarounds are to either    Have only one submit button and use a hidden input to sent the value Use regular submit buttons instead of image maps Use unique names instead of values and check for the presence of name x   name y

User · Answer

You could use formaction attribute  for type submit image  overriding form s action  and pass the non-sensitive value through URL  GET-request    The posted question is not a problem on older browsers  for example on Chrome 49

User · Answer

I was in the same place as you  finally I found a neat answer     lt form action  xx xx  method  POST  gt     lt input type  hidden  name  what you want  value  what you want  gt     lt input type  image  src  xx xx  gt   lt  form gt

User · Answer

Using the type  quot image quot  is problematic because the ability to pass a value is disabled  Although it s not as customizable and thus as pretty  you can still use your images ao long as they are part of a type  quot button quot    lt button type  quot submit quot  name  quot someName quot  value  quot someValue quot  gt  lt img src  quot someImage png quot  alt  quot SomeAlternateText quot  gt  lt  button gt

[html] Input Type image submit form value?

Examples related to html

Examples related to forms