Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Why can't I manually submit this form?

Tags:

html

jquery

forms

I'm trying to get something done before my form submits. The following code runs through without errors, but my form never gets submitted. I can't tell what's wrong..

<form method="post" id="weber-form" class="af-form-wrapper" action="http://www.aweber.com/scripts/addlead.pl">
    <input class="textInputaweb" type="text" name="email" id="email" size="20" value='Enter Email'  onfocus=" if (this.value == 'Enter Email' ) { this.value = ''; }" onblur="if (this.value == '') { this.value='Enter Email';} " />
    <input id="submit" name="submit" class="submitaweber" type="submit" value="Submit"  />
</form>

<script>
    $(function() {
        $('#submit').click(function (e) {
            e.preventDefault();
            // Do something...
            $('#weber-form').submit();
        });
    } 
</script>
like image 322
Yarin Avatar asked Mar 19 '12 06:03

Yarin


People also ask

How do I submit a form?

The Submit Button The <input type="submit"> defines a button for submitting the form data to a form-handler. The form-handler is typically a file on the server with a script for processing input data. The form-handler is specified in the form's action attribute.

How can we submit a form without submit button?

The form can be submitted without using submit button by implementing a specific event attribute or by clicking the link. This task can be done by using the OnClick event attribute or by using the form. submit() method in Javascript.

Can I submit a form with a button outside the form?

For a HTML form element you can put your submit button outside of the form element as long as you have reference the form's id property with the button's form property.

How can I submit a form without reloading?

Use jQuery's submit event to handle the form submit, add return false; at the end of the submit handle function to prevent the page to reload.


2 Answers

for the following script to work, the submit button must NOT have a name or id with the value "submit". a button like this will work:

<input class="submitaweber" type="submit" value="Submit"  />

Demo: http://jsfiddle.net/MYht8/

$(function() {

    //we bind to the form instead of the form button
    //using .on() (jQ1.7+)
    $('#weber-form').on('submit', function(e) {

        //prevent form submission
        e.preventDefault();

        //do stuff

        //use the native submit so we wont trigger 
        //this handler again
        this.submit();
    });
});​
like image 86
Joseph Avatar answered Nov 01 '22 08:11

Joseph


Use your code within document.ready() section. I hope it will work!

$(document).ready(function(){
    $('#submit').click(function (e) {
       e.preventDefault();
       // Do something...  
       $('#weber-form').submit();
     });
});
like image 2
Khaled Javeed Avatar answered Nov 01 '22 07:11

Khaled Javeed