How submit form without page reloading?

Hello Friends!
Hope you all are doing well and enjoy my blog.
If we want to submit a form without page load then we used ajax for do that. i am here telling you a way for submit a form using ajax.
Just copy and paste the “Ajax Code” between the head tag
AJAX CODE

<script type="text/javascript">
    jQuery(document).submit(function(e){
    var form = jQuery(e.target);
    if(form.is("#ff")){ // check if this is the form that you want (delete this check to apply this to all forms)
        e.preventDefault();
        jQuery.ajax({
            type: "POST",
            url: form.attr("action"),  
            data: form.serialize(), // serializes the form's elements.
            success: function(data) {
                alert("Mail Sent!");
                console.log(data); //Reset all the fields
            }
        });
    }
});
</script>

Just copy and paste the “HTML Code” between the body tag

HTML CODE

 <form action="mail.php" method="post"  id="ff">
        <input name="name" id="name" type="text" value="Your Name*"  onfocus="if(this.value == 'Your Name*') {this.value = '';}" onblur="if (this.value == '') {this.value='Your Name*'}"/>
        <input name="email" id="email" type="text" value="Your Email Address*"  onfocus="if(this.value == 'Your Email Address*') {this.value = '';}" onblur="if (this.value == '') {this.value='Your Email Address*'}"/>
        <input name="message" id="message" type="text" value="Your Kids (age, grade, class-subject)"  onfocus="if(this.value == 'Your Kids (age, grade, class-subject)') {this.value = '';}" onblur="if (this.value == '') {this.value='Your Kids (age, grade, class-subject)'}"/>
        <div>
          <input name="" type="submit" value="Send Us Your Information" />
        </div>
      </form>

Enjoy Code!
If anyone want to a full zip file then please drop a mail on my email raghunath.0087@gmail.com
Download Zip File
 

One Reply to “How submit form without page reloading?”

Leave a Reply

Your email address will not be published. Required fields are marked *