If you want to fetch a record from a database using AJAX, you can use a simple PHP script or any other server-side language (e.g., Python, Ruby, etc.) to handle the request and return data to the client. Here’s how you can achieve this with PHP and AJAX using MySQL as an example.
we have created 5 files for fetch record through Ajax from database.
(i) Index.php
(ii) response-file.php
(iii) connection.php
(iv) employee.sql
(v) jquery-1.11.2.min.js
Note:- you can download code from this
(i) index.php:- file which has html form, ajax function and include jquery library file.
Note:- For fetch record, we should use GET method.
<html>
<head>
<script src="jquery-1.11.2.min.js"></script>
<script>
function Ajaxfun() {
var username = $('#uname').val();
$.ajax({// The URL for the request
url : “response-file.php”,
// The data to send (will be converted to a query string)
data : {
uname : username
},
// Whether this is a POST or GET request
type : “GET”,
// Code to run if the request succeeds;
// the response is passed to the function
success : function(response) {
//alert(response);
$(“#ajaxDiv”).html(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);
console.dir(xhr);
},
});
}
</script>
</head>
<body>
<form>
<div style=”width:400px; background-color:#e9eaed”>
<div>
<div style=”float: left;width:30%”>
Select Name
</div>
<div style=”float: left;width:70%”>
<select name=”uname” id=”uname”>
<option value=””>Select Name</option>
<option value=”John”>John</option>
<option value=”Tony”>Tony</option>
<option value=”Leela”>Leela</option>
<option value=”Robert”>Robert</option>
</select>
</div>
</div>
<div style=”clear: both; height:5px;”></div>
<div align=”center” onclick=”Ajaxfun()”>
<input type=”button” name=”getValue” value=”Get Value”/>
</div>
<div style=”clear: both;”></div>
<div id=”ajaxDiv”></div>
</form>
</div>
</body>
</html>
(ii) response-file.php:- which has include database connection file and database query.
<?php
include ('connection.php');
$uname = mysql_real_escape_string($_REQUEST['uname']);
$errmsg = "";
$err_count = 0;if ($uname == ”) {
$errmsg .= “Please select the uname”;
$err_count++;
}
if ($err_count == 0) {
$query = mysql_query(“select * from emp where emp_name='” . $uname . “‘”);
while ($results = mysql_fetch_assoc($query)) {
echo $results[’emp_name’] . ‘ is a ‘ . $results[’emp_desgination’] . ‘ and monthly income is ‘ . $results[’emp_salary’];
}
} else {
echo $errmsg;
}
?>
(iii) connection.php:- which is include in the response-file.php
<?php
$host_name = "localhost";
$user_name = "root";
$password = "";
$database_name = "employee";
$conn = mysql_connect($host_name, $user_name, $password);
if (!$conn) {
die('server is not connect');
} else {
mysql_select_db($database_name, $conn);
}
?>
(iv) employee.sql:- upload in to mysql-database.
(v) jquery-1.11.2.min.js:- this jquery library include in the index.php file.