Insert record through ajax into database

we have created 5 files for insert record through Ajax into database.
(i) Index.php
(ii) response-file.php
(iii) connection.php
(iv) student.sql
(v) jquery-1.11.2.min.js

Now you enter the student name and select the class, after that click the save button for saving data into database.

Note:- you can download code from this

(i) index.php:- file which has html form, ajax function and include jquery library file.

Note:- For insert, update and delete record, we should use POST method not GET method.

		<script src="jquery-1.11.2.min.js"></script>
			function Ajaxfun() {
				var stuname = $('#stuname').val();
				var stuclass = $('#stuclass').val();

					// The URL for the request
					url : "response-file.php",

					// The data to send (will be converted to a query string)
					data : {
						sname : stuname,
						sclass : stuclass

					// Whether this is a POST or GET request
					type : "POST",

					// Code to run if the request succeeds;
					// the response is passed to the function
					success : function(response) {
					// Code to run if the request fails; the raw request and
					// status codes are passed to the function
					error : function(xhr, status, errorThrown) {
						alert("Sorry, there was a problem!");
						console.log("Error: " + errorThrown);
						console.log("Status: " + status);

		<form name="add_stu_record" id="add_stu_record">
			<div style="width:400px; background-color:#e9eaed">
				<div align="center"><h3>Insert Record through Ajax</h3></div>
					<div style="float: left;width:30%">
						Student Name
					<div style="float: left;width:70%">
						<input type="text" name="stuname" id="stuname" />
				<div style="height: 5px; clear: both"></div>
					<div style="float: left;width:30%">
						Student Class
					<div style="float: left;width:70%">
						<select name="stuclass" id="stuclass">
							<option value="">Select Class</option>
							<option value="bca">BCA</option>
							<option value="mca">MCA</option>
							<option value="btech">Btech</option>
							<option value="bba">BBA</option>
							<option value="mba">MBA</option>
				<div style="clear: both;  height:5px;"></div>
				<div align="center" onclick="Ajaxfun()">
					<input type="button" name="getValue" value="Save" />
				<div style="clear: both;"></div>
				<div id="ajaxDiv"></div>
				<div style="clear: both;  height:5px;"></div>

(ii) response-file.php:- which has include database connection file and database query.

include ('connection.php');
$sname = mysql_real_escape_string($_REQUEST['sname']);
$sclass = mysql_real_escape_string($_REQUEST['sclass']);
$errmsg = "";
$err_count = 0;

if ($sname == '') {
	$errmsg .= "<div style='color:#ff0000';>Please enter student name!</div>";
if ($sclass == '') {
	$errmsg .= "<div style='color:#ff0000';>Please select the student class!</div>";
if ($err_count == 0) {
	$query = "insert into stuinfo(stu_name,stu_class) values('".$sname."','".$sclass."')";
		echo 'Error: Record is not save' ;
		echo "<div style='color:#008000';>Insert record save successfully</div>";
} else {
	echo $errmsg;

(iii) connection.php:- which is include in the response-file.php

$host_name = "localhost";
$user_name = "root";
$password = "";
$database_name = "student";
$conn = mysql_connect($host_name, $user_name, $password);
if (!$conn) {
	die('server is not connect');
} else {
	mysql_select_db($database_name, $conn);

(iv) student.sql:- upload in to mysql-database.

(v) jquery-1.11.2.min.js:- this jquery library include in the index.php file.

Note:- For update and delete record through ajax is very simple, you should change only query into response-file.php