Skip to content Skip to sidebar Skip to footer
Home / Forms / Hyperlink / Javascript / Jquery

Using JQuery To Submit Form From Link Outside Of Form

Post a Comment
I'm trying to submit a form from a link that is located in my nav bar. I'm new to javascript.jQuery and unsure why this won't execute. I have a feeling there I need to put somethi

Solution 1:

in pure JavaScript: (http://jsfiddle.net/4enf7/)

<a href="javascript:document.getElementById('add-product-form').submit();">Send form</a>

Solution 2:

Link:

<a href="#" id="add-product-save-link" class="icon-plus" ><i>Save</i></a>

jQuery:

$(document).ready(function() { 
    $('#add-product-save-link').click(function() {
        $('#add-product-form').submit();
    });
});

You don't need the e.preventDefault(), because your anchor tag isn't going anywhere (the href is #).

Because your <form> tag's action attribute is blank, that means that the form will submit itself to this same document. If that is what you want to do, then you can put the logic for that at the top of your document:

<?php
    if (isset($_POST)) {
        //do your form processing here
    }else{
        //your normal page is here.
    }
?>

Finally, because this answer uses jQuery, ensure that you reference the jQuery library somewhere, such as in the <head> tags:

<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    </head>

Solution 3:

You are clicking in the "A", not in the Italic (With ID). Supposing you will not change the HTML to that work out you should use this:

$(document).ready(function() {  
    $('#add-product-save-link').parent().click(function(e) {
        $('#add-product-form').submit();
        return false;
    });
});

Solution 4:

$("#button").click(function(e){

        $.post('url.php', $("#form").serialize(), function(data){

Post a Comment for "Using JQuery To Submit Form From Link Outside Of Form"