submit form with normal link, wont work

Question

I have this:

<a style="display: inline-block; width: 100px; font-weight: bold;"
   href="javascript:submit()">Search</a>

As instead of a button with submit, but nothing happens when you click..

How can do this?

Answer 1

You need document.yourFormNameHere.submit(); not just submit()

Answer 2

You must define the form to be submitted..

so give the form an id and use it to target the form like this

<form id="someid">
...
<a style="display: inline-block; width: 100px; font-weight: bold;" href="javascript:document.getElementById('someid').submit()"  >Search </a>

Answer 3

you have javascript:submit(), but what is it going to submit? Try something along the lines of :

href="javascript:document.getElementById('formId').submit();"

Or even better yet, try giving an id to your and then move the styles and javascript into separate files appropriately. This will keep your markup clean and more manageable.

/* in some sort of external css that is included */
#formSubmissionLink {
    display: inline-block; 
    font-weight: bold;
    width: 100px;
}

/* in some sort of external JS that is included at the end of the html*/
(function () {
    document.getElementById("formSubmissionLink").onclick = function () {
        document.getElementById("formId").submit();
        return false;
    };
})();

and then your html would be: <a id="formSubmissionLink" href="#">Search</a>

Answer 4

<form id='demoForm'><br>
Demo field<input type='text' name='demoItem' /><br>
</form>

//place this link anywhere in html
<a style="display: inline-block; width: 100px; font-weight: bold;"
   href="submitForm()">Search</a>

///java script
function submitForm()
{
    document.getElementById('demoForm').submit();       
}