How to submit a form with JavaScript by clicking a link

Question

Instead of a submit button I have a link    lt form gt      lt a href     gt  submit  lt  a gt    lt  form gt    Can I make it submit the form when it is clicked

User · Answer

You could give the form and the link some ids and then subscribe for the onclick event of the link and submit the form:

<form id="myform" action="" method="POST">
    <a href="#" id="mylink"> submit </a>
</form>

and then:

window.onload = function() {
    document.getElementById('mylink').onclick = function() {
        document.getElementById('myform').submit();
        return false;
    };
};

I would recommend you using a submit button for submitting forms as it respects the markup semantics and it will work even for users with javascript disabled.

User · Answer

HTML  amp  CSS - No Javascript Solution     Make your button appear like a Bootstrap link   HTML    lt form gt       lt button class  btn-link  gt Submit lt  button gt   lt  form gt    CSS    btn-link        background  none      border  none      padding  0px      color   3097D1      font  inherit       btn-link hover        color   216a94      text-decoration  underline

User · Answer

this works well without any special function needed  Much easier to write with php as well   lt input onclick  this form submit     gt

User · Answer

lt form id  mailajob  method  post  action  emailthijob php  gt       lt input type  hidden  name  action  value  emailjob    gt       lt input type  hidden  name  jid  value   lt  php echo  jobid    gt     gt   lt  form gt    lt a class  emailjob  onclick  document getElementById  mailajob   submit     gt Email this job lt  a gt

User · Answer

document getElementById  theForm   submit      It works perfect in my case   you can use it in function also like   function submitForm          document getElementById  theForm   submit         Set  theForm  as your form ID  It s done

User · Answer

The best way  The best way is to insert an appropriate input tag    lt input type  submit  value  submit    gt    The best JS way   lt form id  form-id  gt     lt button id  your-id  gt submit lt  button gt   lt  form gt    var form   document getElementById  form-id     document getElementById  your-id   addEventListener  click   function        form submit          Enclose the latter JavaScript code by an DOMContentLoaded event  choose only load for backward compatiblity  if you haven t already done so   window addEventListener  DOMContentLoaded   function        var form   document        copy the last code block        The easy  not recommandable way  the former answer   Add an onclick attribute to the link and an id to the form    lt form id  form-id  gt      lt a href     onclick  document getElementById  form-id   submit     gt  submit  lt  a gt    lt  form gt    All ways  Whatever way you choose  you have call formObject submit   eventually  where formObject is the DOM object of the  lt form gt  tag    You also have to bind such an event handler  which calls formObject submit    so it gets called when the user clicked a specific link or button  There are two ways    Recommended  Bind an event listener to the DOM object      1  Acquire a reference to our  lt form gt         This can also be done by setting  lt form name  blub  gt            var form   document forms blub   var form   document getElementById  form-id         2  Get a reference to our preferred element  link button  see below  and       add an event listener for the  click  event  document getElementById  your-id   addEventListener  click   function        form submit         Not recommended  Insert inline JavaScript  There are several reasons why this technique is not recommendable  One major argument is that you mix markup  HTML  with scripts  JS   The code becomes unorganized and rather unmaintainable    lt a href     onclick  document getElementById  form-id   submit     gt submit lt  a gt    lt button onclick  document getElementById  form-id   submit     gt submit lt  button gt     Now  we come to the point at which you have to decide for the UI element which triggers the submit   call    A button   lt button gt submit lt  button gt   A link   lt a href     gt submit lt  a gt     Apply the aforementioned techniques in order to add an event listener

User · Answer

If you use jQuery and would need an inline solution  this would work very well    lt a href     onclick    this  closest  form   submit     gt submit form lt  a gt    Also  you might want to replace    lt a href     gt text lt  a gt    with   lt a href  javascript void 0    gt text lt  a gt    so the user does not scroll to the top of your page when clicking the link

User · Answer

here s the best solution to your question  inside the form you have these code    lt li gt  lt a href     gt Singup lt  a gt  lt  li gt   lt button type  submit  id  haha  gt  lt  button gt    in the CSS file  do this    button    display  none      in JS you do this      a   click function          button   trigger  click         There you go

[javascript] How to submit a form with JavaScript by clicking a link?

Examples related to javascript

Examples related to html

Examples related to forms

Examples related to hyperlink