In this post I will explain how to fetch data or records between two dates using Ajax, PHP and mySql. This topic is very important part of any web developer point of view.
Fetching data between two dates are widely used in various industry like various e-commerce site and portals and many more. In this post I am using Ajax, PHP and mySql to fetch data or records between two dates.
This post contains followings files:
- config.php
- employee_add.php
- employee_insert.php
- employee_search.php
- search_result.php
Follow these steps to fetch data or records between two dates
Step 1. Crate a database , and give database name like tutorials
Step 2. Create a table under tutorials database and give table name like employee. This table having five fields like emp_id, emp_name, emp_gender, emp_email, emp_mobile, emp_address, emp_join_date so table structure shown below
Step 3. Crate config.php file, code shown below
<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "tutorials";
// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
?>
Step 4. Crate employee_add.php file, code shown below
<!DOCTYPE html>
<html lang="en">
<head>
<title>Add Employee Records</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
</head>
<body>
<form action="employee_insert.php" method="post">
<h2 align="center">Add Employees Record using PHP and MySQL</h2><hr /><br />
<table align="center" border="1">
<tbody>
<tr>
<td>Name</td>
<td><input name="name" placeholder="Name" type="text" required></td>
<tr>
<td>Gender</td>
<td>
<input name="gender" type="radio" value="male" checked="">Male
<input name="gender" type="radio" value="female">Female
</td>
</tr>
<tr>
<td>Email Id.</td>
<td><input name="email" id="email" placeholder="Email Id." type="text" required></td>
</tr>
<tr>
<td>Mobile No.</td>
<td><input name="mobile" id="mobile" placeholder="Mobile No." type="text" maxlength="10" required></td>
</tr>
<tr>
<td>Address:</td>
<td><textarea name="address" placeholder="Address" rows="5" required></textarea></td>
</tr>
<tr>
<td>Joining Date</td>
<td><input name="joindate" id="joindate" type="text" required placeholder="Select Date"></td>
</tr>
<tr>
<td></td>
<td><input type="submit" name="submit" value="Submit"></td>
</tr>
</tbody>
</table>
</form>
</body>
</html>
<script>
$(document).ready(function(){
$.datepicker.setDefaults({
dateFormat: 'yy-mm-dd'
});
$(function(){
$("#joindate").datepicker();
});
});
</script>
Step 5. Create employee_insert.php file, code shown below
<?php
include_once('config.php');
$name = $_POST['name'];
$gender = $_POST['gender'];
$email = $_POST['email'];
$mobile = $_POST['mobile'];
$address = $_POST['address'];
$joindate = $_POST['joindate'];
$data
= "insert into employee (emp_name, emp_gender, emp_email, emp_mobile,
emp_address, emp_join_date) values ('$name', '$gender', '$email',
'$mobile', '$address', '$joindate')";
$result = mysqli_query($conn, $data);
if(isset($result))
{
echo "Record Add Successfully...";
}
else
{
echo "Employee Entry not Inserted";
}
?>
<!DOCTYPE html>
<html>
<head>
<title>View Employees Record</title>
</head>
<body>
<form action="employee_search.php">
<br/>
<input type="submit" name="view" value="View Employees Record">
</form>
</body>
</html>
Step 6. Create employee_search.php file code shown below
<?php
include_once('config.php');
$data = "select * from employee order by emp_id asc";
$result = mysqli_query($conn, $data);
?>
<!DOCTYPE html>
<html>
<head>
<title>Fetch Data Between Two Dates Using Ajax, PHP and MySql</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
</head>
<body>
<br /><br />
<h2 align="center">Fetch Data Between Two Dates Using Ajax, PHP and MySql</h2><hr /><br />
<table border="0" align="center">
<tbody>
<tr>
<td>
<input type="text" name="fdate" id="fdate"
placeholder="From Date"
/>
<input type="text" name="tdate" id="tdate" placeholder="To
Date" />
<input type="button" name="search" id="search" value="SEARCH" />
</td>
</tr>
</tbody>
</table>
<br />
<table border="1" align="center" id="search_table">
<tr>
<th width="5%">Id</th>
<th width="30%">Name</th>
<th width="10%">Gender</th>
<th width="25%">Email</th>
<th width="15%">Mobile No</th>
<th width="15%">Join Date</th>
</tr>
<?php
while($row = mysqli_fetch_array($result))
{
?>
<tr>
<td><?php echo $row["emp_id"]; ?></td>
<td><?php echo $row["emp_name"]; ?></td>
<td><?php echo $row["emp_gender"]; ?></td>
<td><?php echo $row["emp_email"]; ?></td>
<td><?php echo $row["emp_mobile"]; ?></td>
<td><?php echo $row["emp_join_date"]; ?></td>
</tr>
<?php
}
?>
</table>
</body>
</html>
<script>
$(document).ready(function(){
$.datepicker.setDefaults({
dateFormat: 'yy-mm-dd'
});
$(function(){
$("#fdate").datepicker();
$("#tdate").datepicker();
});
$('#search').click(function(){
var fdate = $('#fdate').val();
var tdate = $('#tdate').val();
if(fdate != '' && tdate != '')
{
$.ajax({
url:"search_result.php",
method:"POST",
data:{fdate:fdate, tdate:tdate},
success:function(data)
{
$('#search_table').html(data);
}
});
}
else
{
alert("Please Select Date");
}
});
});
</script>
Step 7. Create search_result.php file code shown below
<?php
include_once('config.php');
if(isset($_POST["fdate"], $_POST["tdate"]))
{
$results = '';
$data = "select * from employee where emp_join_date between '".$_POST["fdate"]."' and '".$_POST["tdate"]."'
";
$result = mysqli_query($conn, $data);
$results .= '
<table border="1" align="center">
<tr>
<th width="5%">ID</th>
<th width="30%">Name</th>
<th width="10%">Gender</th>
<th width="25%">Email</th>
<th width="15%">Mobile</th>
<th width="15%">Join Date</th>
</tr>
';
if(mysqli_num_rows($result) > 0)
{
while($row = mysqli_fetch_array($result))
{
$results .= '
<tr>
<td>'. $row["emp_id"] .'</td>
<td>'. $row["emp_name"] .'</td>
<td>'. $row["emp_gender"] .'</td>
<td>'. $row["emp_email"] .'</td>
<td>'. $row["emp_mobile"] .'</td>
<td>'. $row["emp_join_date"] .'</td>
</tr>
';
}
}
else
{
$results .= '
<tr>
<td colspan="6">No Records Found</td>
</tr>
';
}
$results .= '</table>';
echo $results;
}
?>
Step 8. Now go to browser and type localhost/tutorials/employee_add.php (here tutorilals is the root folder) and run screen shown below
Step 9. Now fill up values in required fields then click submit button screen shown below
Step 9. Now fill up values in required fields then click submit button screen shown below
Step 10. Click View Employee Record button, screen shown below
Step 11. Now select the date in required fields in which date you want to search the records of employee then click Search button, search result will display screen shown below
I hope, it helped you to understand, how to fetch records between two date using Ajax, PHP and mySql for questions kindly drop your comment below
Thanks.
Pgejoint is the Most Visited Online Platform that Delivers Hot Fresh Nigerian Music, Video, relationship tips, advice, Entertainment Gist &.....
No comments:
Post a Comment