Verification: a143cc29221c9be0

Not refresh page in php

Not refresh page in php

1. Main Web Page

Create and index.html file on your website using following content. This is the main HTML form that will display on the website page. You can simply integrate a form into any website page.

Submit Form without Page Refresh - PHP/jQuery -
Phone No:
Gender: Male Female

Your data will display below.....

2. Create JavaScript

Now create a JavaScript page with name submit.js inside js directory using following content. You can optimize this JavaScript by adding the jQuery validations.

function SubmitFormData(){
    var name = $("#name").val();
    var email = $("#email").val();
    var phone = $("#phone").val();
    var gender = $("input[type=radio]:checked").val();
    $.post("submit.php", { name: name, email: email, phone: phone, gender: gender },
    function(data) {

3. Create PHP Script

Now create a PHP script named submit.php. This script will do all your backed operations. When we submit the web form, This script will get all arguments from the POST. You can customize this script according to your requirement like save values in the database, Email records to Admin, etc.

  echo $_POST['email'] ."
"; echo $_POST['phone'] ."
"; echo $_POST['gender'] ."
"; echo "==============================
"; echo "All Data Submitted Successfully!"; ?>

Validate PHP Form Data with JavaScript

Submit PHP Form Data using JavaScript

Under this tutorial, you will learn how to submit a HTML form with form data validation without refresh of webpage by using pure vanilla javascript with Ajax PHP and then after insert HTML form data into Mysql database using Ajax with PHP. In this post you do not need to download jQuery library or do not include jQuery javascript library link at header of your webpage. This is because we will use only javascript so for use javascript in web page, you do not include any library in your webpage because javascript should be included in or referenced by an HTML web page for the code has been interpreted by the browser.

In the current time, there are web traffic has been increase day by day popularity of our website, so at that time we have want to increase our website web experience. So for increase web experience, we have to improve our web application by providing better user experience by optimize our website and reduce traffic to our web application. So for optimize our website, first we want to reduce not necessary web page reload. So for refresh web page reload we have to submit form data without refresh of web page. So this will reduces load on internet to reload entire web page our web application without refresh of web page.

Under this tutorial, for implement form data with validation of form data without refresh of web page using javascript with php. For this here we will create HTML web form and then after we will submit form data without refresh of web page and perform form data validation in background PHP server side process and get response from server back to HTML web page. If there is any validation error has occure, then it will display validation error on web page, and if data successfully inserted, then it will display success message on web page. So this is a great way to improve the user our website user experience of our website and then submit forms with validation without a page refresh. In this post, you can find how to submit form with validation of form data using javascript with PHP script. For this feature we will make sample form with some form field and then after we will submit all form field with PHP script and at PHP script it will validate form data and insert into database without refresh of web page using pure vanilla javascript.

Submit Form without Page Refresh using JavaScript with PHP