How to make a submit out of a a href a link

Question

I got an image with which links to another page using  lt a href       gt   lt img     gt   lt  a gt    How can I make it make a post like if it was a button  lt input type  submit     gt

User · Answer

We replace the submit button with this all the time on forms:

<form method="post" action="whatever.asp">
<input type=...n

<input type="image" name="Submit" src="/graphics/continue.gif" align="middle" border="0" alt="Continue">
</form>

Clicking the image submits the form. Hope that helps!

User · Answer

Dont forget the  BUTTON  element wich can handle some more HTML inside

User · Answer

Untested   could be better    lt form action  page-you re-submitting-to html  method  POST  gt       lt a href     onclick  document forms 0  submit   return false   gt  lt img src  whatever jpg    gt  lt  a gt   lt  form gt

User · Answer

lt html gt     lt  php   echo   POST  c           POST  d           POST  e        gt     lt form action  test php  method  POST  gt         lt input type  hidden  name  c  value  toto98  gt         lt input type  hidden  name  d  value  toto97  gt         lt input type  hidden  name  e  value  toto aaaaaaaaaaaaaaaaaaaa  gt          lt a href    onclick  document forms 0  submit   return false   gt Click lt  a gt     lt  form gt    lt  html gt    So easy      So easy

User · Answer

It looks like you re trying to use an image to submit a form    in that case use  lt input type  image  src       gt   If you really want to use an anchor then you have to use javascript    lt a href     onclick  document forms  myFormName   submit    return false   gt     lt  a gt

User · Answer

Something like this page     lt  DOCTYPE html PUBLIC  -  W3C  DTD XHTML 1 0 Strict  EN   http   www w3 org TR xhtml1 DTD xhtml1-strict dtd  gt   lt html xmlns  http   www w3 org 1999 xhtml  lang  fr  gt   lt head gt       lt meta http-equiv  Content-Type  content  text html  charset utf-8    gt       lt title gt BSO Communication lt  title gt    lt style type  text css  gt   submit       border   0      background   url ok gif  left top no-repeat      height   24px      width   24px      cursor   pointer      text-indent   -9999px    html first-child  submit       padding-left   1000px     lt  style gt   lt  -- if IE  gt   lt style type  text css  gt   submit       text-indent   0      color   expression this value           lt  style gt   lt   endif -- gt   lt  head gt    lt body gt       lt h1 gt Display input submit as image with CSS lt  h1 gt        lt p gt Take a look at  lt a href   2007 07 26 afficher-un-input-submit-comme-une-image   gt the related article lt  a gt   in french   lt  p gt       lt form action    method  get  gt           lt fieldset gt               lt legend gt Some form lt  legend gt               lt p class  field  gt                   lt label for  input  gt Some value lt  label gt                    lt input type  text  id  input  name  value    gt                   lt input type  submit  class  submit    gt               lt  p gt           lt  fieldset gt       lt  form gt        lt hr   gt       lt p gt This page is part of the  lt a href  http   www bsohq fr  gt BSO Communication blog lt  a gt   lt  p gt    lt  body gt   lt  html gt

User · Answer

lt html gt     lt  php   echo   POST  c           POST  d           POST  e        gt     lt form action  test php  method  POST  gt         lt input type  hidden  name  c  value  toto98  gt         lt input type  hidden  name  d  value  toto97  gt         lt input type  hidden  name  e  value  toto aaaaaaaaaaaaaaaaaaaa  gt          lt a href    onclick  document forms 0  submit   return false   gt Click lt  a gt     lt  form gt    lt  html gt    So easy      So easy

User · Answer

input type image will do it for you

User · Answer

It looks like you re trying to use an image to submit a form    in that case use  lt input type  image  src       gt   If you really want to use an anchor then you have to use javascript    lt a href     onclick  document forms  myFormName   submit    return false   gt     lt  a gt

User · Answer

We replace the submit button with this all the time on forms:

<form method="post" action="whatever.asp">
<input type=...n

<input type="image" name="Submit" src="/graphics/continue.gif" align="middle" border="0" alt="Continue">
</form>

Clicking the image submits the form. Hope that helps!

User · Answer

Dont forget the  BUTTON  element wich can handle some more HTML inside

User · Answer

What might be a handy addition to this is the possibility to change the post-url from the extra button so you can post to different urls with different buttons  This can be achieved by setting the form  action  property  Here s the code for that when using jQuery        href button name    click function e        e preventDefault             form name    attr  action    alternateurl php             form name    submit          The action-attribute has some issues with older jQuery versions  but on the latest you ll be good to go

User · Answer

Untested   could be better    lt form action  page-you re-submitting-to html  method  POST  gt       lt a href     onclick  document forms 0  submit   return false   gt  lt img src  whatever jpg    gt  lt  a gt   lt  form gt

User · Answer

lt input type  image  name  your image name  src  your image url png    gt    This will send the your image name x and your image name y values as it submits the form  which are the x and y coordinates of the position the user clicked the image

User · Answer

More generic approatch using JQuery library closest   and submit   buttons  Here you do not have to specify whitch form you want to submit  submits the form it is in    lt a href     onclick    this  closest  form   submit    gt Submit Link lt  a gt

User · Answer

input type image will do it for you

User · Answer

It looks like you re trying to use an image to submit a form    in that case use  lt input type  image  src       gt   If you really want to use an anchor then you have to use javascript    lt a href     onclick  document forms  myFormName   submit    return false   gt     lt  a gt

User · Answer

Something like this page     lt  DOCTYPE html PUBLIC  -  W3C  DTD XHTML 1 0 Strict  EN   http   www w3 org TR xhtml1 DTD xhtml1-strict dtd  gt   lt html xmlns  http   www w3 org 1999 xhtml  lang  fr  gt   lt head gt       lt meta http-equiv  Content-Type  content  text html  charset utf-8    gt       lt title gt BSO Communication lt  title gt    lt style type  text css  gt   submit       border   0      background   url ok gif  left top no-repeat      height   24px      width   24px      cursor   pointer      text-indent   -9999px    html first-child  submit       padding-left   1000px     lt  style gt   lt  -- if IE  gt   lt style type  text css  gt   submit       text-indent   0      color   expression this value           lt  style gt   lt   endif -- gt   lt  head gt    lt body gt       lt h1 gt Display input submit as image with CSS lt  h1 gt        lt p gt Take a look at  lt a href   2007 07 26 afficher-un-input-submit-comme-une-image   gt the related article lt  a gt   in french   lt  p gt       lt form action    method  get  gt           lt fieldset gt               lt legend gt Some form lt  legend gt               lt p class  field  gt                   lt label for  input  gt Some value lt  label gt                    lt input type  text  id  input  name  value    gt                   lt input type  submit  class  submit    gt               lt  p gt           lt  fieldset gt       lt  form gt        lt hr   gt       lt p gt This page is part of the  lt a href  http   www bsohq fr  gt BSO Communication blog lt  a gt   lt  p gt    lt  body gt   lt  html gt

User · Answer

lt input type  image  name  your image name  src  your image url png    gt    This will send the your image name x and your image name y values as it submits the form  which are the x and y coordinates of the position the user clicked the image

User · Answer

Something like this page     lt  DOCTYPE html PUBLIC  -  W3C  DTD XHTML 1 0 Strict  EN   http   www w3 org TR xhtml1 DTD xhtml1-strict dtd  gt   lt html xmlns  http   www w3 org 1999 xhtml  lang  fr  gt   lt head gt       lt meta http-equiv  Content-Type  content  text html  charset utf-8    gt       lt title gt BSO Communication lt  title gt    lt style type  text css  gt   submit       border   0      background   url ok gif  left top no-repeat      height   24px      width   24px      cursor   pointer      text-indent   -9999px    html first-child  submit       padding-left   1000px     lt  style gt   lt  -- if IE  gt   lt style type  text css  gt   submit       text-indent   0      color   expression this value           lt  style gt   lt   endif -- gt   lt  head gt    lt body gt       lt h1 gt Display input submit as image with CSS lt  h1 gt        lt p gt Take a look at  lt a href   2007 07 26 afficher-un-input-submit-comme-une-image   gt the related article lt  a gt   in french   lt  p gt       lt form action    method  get  gt           lt fieldset gt               lt legend gt Some form lt  legend gt               lt p class  field  gt                   lt label for  input  gt Some value lt  label gt                    lt input type  text  id  input  name  value    gt                   lt input type  submit  class  submit    gt               lt  p gt           lt  fieldset gt       lt  form gt        lt hr   gt       lt p gt This page is part of the  lt a href  http   www bsohq fr  gt BSO Communication blog lt  a gt   lt  p gt    lt  body gt   lt  html gt

User · Answer

input type image will do it for you

User · Answer

Untested   could be better    lt form action  page-you re-submitting-to html  method  POST  gt       lt a href     onclick  document forms 0  submit   return false   gt  lt img src  whatever jpg    gt  lt  a gt   lt  form gt

User · Answer

More generic approatch using JQuery library closest   and submit   buttons  Here you do not have to specify whitch form you want to submit  submits the form it is in    lt a href     onclick    this  closest  form   submit    gt Submit Link lt  a gt

User · Answer

Something like this page     lt  DOCTYPE html PUBLIC  -  W3C  DTD XHTML 1 0 Strict  EN   http   www w3 org TR xhtml1 DTD xhtml1-strict dtd  gt   lt html xmlns  http   www w3 org 1999 xhtml  lang  fr  gt   lt head gt       lt meta http-equiv  Content-Type  content  text html  charset utf-8    gt       lt title gt BSO Communication lt  title gt    lt style type  text css  gt   submit       border   0      background   url ok gif  left top no-repeat      height   24px      width   24px      cursor   pointer      text-indent   -9999px    html first-child  submit       padding-left   1000px     lt  style gt   lt  -- if IE  gt   lt style type  text css  gt   submit       text-indent   0      color   expression this value           lt  style gt   lt   endif -- gt   lt  head gt    lt body gt       lt h1 gt Display input submit as image with CSS lt  h1 gt        lt p gt Take a look at  lt a href   2007 07 26 afficher-un-input-submit-comme-une-image   gt the related article lt  a gt   in french   lt  p gt       lt form action    method  get  gt           lt fieldset gt               lt legend gt Some form lt  legend gt               lt p class  field  gt                   lt label for  input  gt Some value lt  label gt                    lt input type  text  id  input  name  value    gt                   lt input type  submit  class  submit    gt               lt  p gt           lt  fieldset gt       lt  form gt        lt hr   gt       lt p gt This page is part of the  lt a href  http   www bsohq fr  gt BSO Communication blog lt  a gt   lt  p gt    lt  body gt   lt  html gt

User · Answer

lt input type  image  name  your image name  src  your image url png    gt    This will send the your image name x and your image name y values as it submits the form  which are the x and y coordinates of the position the user clicked the image

User · Answer

lt input type  image  name  your image name  src  your image url png    gt    This will send the your image name x and your image name y values as it submits the form  which are the x and y coordinates of the position the user clicked the image

User · Answer

Untested   could be better    lt form action  page-you re-submitting-to html  method  POST  gt       lt a href     onclick  document forms 0  submit   return false   gt  lt img src  whatever jpg    gt  lt  a gt   lt  form gt

User · Answer

input type image will do it for you

User · Answer

Dont forget the  BUTTON  element wich can handle some more HTML inside

User · Answer

Dont forget the  BUTTON  element wich can handle some more HTML inside

User · Answer

It looks like you re trying to use an image to submit a form    in that case use  lt input type  image  src       gt   If you really want to use an anchor then you have to use javascript    lt a href     onclick  document forms  myFormName   submit    return false   gt     lt  a gt

User · Answer

What might be a handy addition to this is the possibility to change the post-url from the extra button so you can post to different urls with different buttons  This can be achieved by setting the form  action  property  Here s the code for that when using jQuery        href button name    click function e        e preventDefault             form name    attr  action    alternateurl php             form name    submit          The action-attribute has some issues with older jQuery versions  but on the latest you ll be good to go

[javascript] How to make a submit out of a <a href...>...</a> link?

Examples related to javascript

Examples related to html

Examples related to form-submit

Examples related to url-link