IDIOT DEVELOPER

Submit Form using jQuery AJAX in PHP
Submit Form using jQuery AJAX in PHP

The AJAX forms seem to be used everywhere. In fact, most PHP web app development project are now being developed with AJAX forms. And, if you look at any Jquery Ajax Post example, then you are at the right place. In this tutorial we are are going to build a simple HTML form and submitting its values using jQuery and AJAX on the server. Just implement this and enrich your web applications.

 

HTML Code

 


<form method="post">
<ul>
<li>
<input type="text" id="name" placeholder="Name" />
</li>
<li>
<input type="email" id="email" placeholder="Email" />
</li>
<li>
<input type="password" id="password" placeholder="Password" />
</li>
</ul>
<input type="button" value="Submit" class="submit" />
</form>

 

JavaScript Code

 


<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js "></script>

<script>
$(document).ready(function(){
$(".submit").click(function(){

var name = $("#name").val();
var email = $("#email").val();
var password = $("#password").val();

var dataStr = "name=" + name + "&email=" + email + "&password=" + password;

if(name=='' || email=='' || password==''){
alert("Please enter valid data");
}else{
$.ajax({
type: "POST",
url: "send_data.php",
data: dataStr,
success: function(){
alert("Data Submitted");
}
});
}

});
});
</script>

 

 

send_data.php

This page is going to receive the data send through the AJAX.

 


<?php
if($POST){
$name = $_POST['name'];
$email = $_POST['email'];
$password = $_POST['password'];
}
?>

 

We have received the data now we can do anything with it, according to our choice.

Leave a Reply

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