Submit form using ajax without refreshing page

Must Read : Submit form using ajax without refreshing page

Today, I’ll teach you, how to submit form using ajax, without refreshing page. Its very simple and easy way.
You just need to download latest jQuery. I’ve give you a very simple example so that everyone can understand it easily.

we just need to add jquery file into your page. We can submit the form without refreshing page.
To understand it completely just follow the steps.
Step-1:
Create a file form.html and insert some input fields. For this tutorials, Insert three text fields (First Name, Last Name, Email) and set their ids and names to fname, lname, & email. and a Submit button.
Now Place a div at the bottom and set its id to status.

Code:

Step-2
Now download jquery file  and place this file in the project folder, and add this file to our page.
to do this place this code in the head section of the form.html page.
Code:

Now, we can use jquery in our page.
Now add the following code in the head section
code:

This code will be used to submit form through ajax.Final Code of form.html page 

Step-3
Create an Empty php file with the name form2.php and place following code in the file.

When we’ll submit the form, the form values will be posted to this (form2.php) page. You can perform different operation on the receiving data.
(Visited 214 times, 1 visits today)

Leave a Comment.