Step 1: Create a View file like blog.blade.php add some fields like birthdate .
resources/views/welcome.blade.php
<html>
<head>
<title>Age Calculator</title>
<link rel='stylesheet' href='style.css'/>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-latest.min.js"></script>
<script src='script.js'></script>
</head>
<br>
<body>
<div id="main_container" class="container">
<div class="row">
<div class="col-md-6">
<div class="form-group">
<div id="birth_date_input" class="control-label">Birth Date*:
<input type="date" id="birth_date" class="form-control">
</div>
</div>
</div>
<div class="col-md-6">
<button id="calculate" class="btn btn-success" style="margin-top: 25px;">Calculate your age</button>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div id="age_container"><span id="exact_age"></span></div>
<div id="age_container"><span id="exact_age1"></span></div>
<div id="age_container"><span id="exact_age2"></span></div>
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function(){
$("#calculate").click(function(){
var birth=$("#birth_date").val();
$.ajax({
type:"POST",
url: '{{url('caldate')}}',
data: {"_token": "{{ csrf_token() }}",
birthdate : birth},
dataType: 'json',
success: function (data) {
$('#exact_age').text(data.years);
}
});
});
});
</script>
</body>
</html>
public function caldate(Request $request)
{
$birthdate = $request->input('birthdate');
$today = date('Y-m-d');
$date1=date_create($birthdate);
$date2=date_create($today);
$diff=date_diff($date1,$date2);
$value['years'] = $diff->format("%Y Years %M Months %D Days");
return response()->json($value);
}
Route::post('caldate', 'BlogController@caldate');