Copy and Paste the Code in .aspx Page :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Calculate Age using JavaScript</title>
<script type="text/javascript">
function CalculateAge() {
var inputdob = document.getElementById("txtDOB").value;
//regular expression to validate date formate mm/dd/yyyy
var rex = /^(0[1-9]|1[012])[- /.](0[1-9]|[12][0-9]|3[01])[- /.](19|20)\d\d+$/;
if (rex.test(inputdob)) {
//convet to input date into Date object
var DOBDate = new Date(inputdob);
//get the current date
var currentDate = new Date();
var monthDiff = currentDate.getMonth() - DOBDate.getMonth();
var yearDiff = currentDate.getFullYear() - DOBDate.getFullYear();
var dayDiff = currentDate.getDate() - DOBDate.getDate();
if (isNaN(yearDiff)) {
document.getElementById("LableMsg").innerHTML = "Input date is incorrect.";
}
else {
if (monthDiff < 0 ) {
yearDiff = parseInt(yearDiff,10) - 1;
monthDiff= 12 + parseInt(monthDiff,10);
if(dayDiff < 0){
monthDiff = parseInt(monthDiff,10)-1;
dayDiff = 30 + parseInt(dayDiff,10);
document.getElementById('LableMsg').innerHTML = 'Age : ' + yearDiff + ' Years ' + monthDiff + ' Months ' + dayDiff + ' Days';
}
else{
document.getElementById('LableMsg').innerHTML = 'Age : ' + yearDiff + ' Years ' + monthDiff + ' Months ' + dayDiff + ' Days';
}
}
else {
if(monthDiff==0){
yearDiff = parseInt(yearDiff,10) - 1;
if(dayDiff < 0){
dayDiff = 30 + parseInt(dayDiff,10);
document.getElementById('LableMsg').innerHTML = 'Age : ' + yearDiff + ' Years ' + monthDiff + ' Months ' + dayDiff + ' Days';
}
else{
document.getElementById('LableMsg').innerHTML = 'Age : ' + yearDiff + ' Years ' + monthDiff + ' Months ' + dayDiff + ' Days';
}
}
else{
if(dayDiff < 0){
monthDiff = parseInt(monthDiff,10)-1;
dayDiff = 30 + parseInt(dayDiff,10);
document.getElementById('LableMsg').innerHTML = 'Age : ' + yearDiff + ' Years ' + monthDiff + ' Months ' + dayDiff + ' Days';
}
else{
document.getElementById('LableMsg').innerHTML = 'Age : ' + yearDiff + ' Years ' + monthDiff + ' Months ' + dayDiff + ' Days';
}
}
}
}
}
else {
document.getElementById('LableMsg').innerHTML = 'Date must be of mm/dd/yyyy format';
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<table>
<tr>
<td>
<pre class="code" style="background-color: white; border: 6px solid rgb(234, 234, 234); color: #444444; font-family: 'courier new'; font-size: 13px; line-height: 18px; outline: rgb(212, 212, 212) solid 1px; overflow: auto; padding: 15px; position: relative; text-align: justify; width: 600px;"><asp:Label ID="lblDOB" runat="server" Text="Enter Your Date of Birth : "
style="color: #3366FF"></asp:Label> : <asp:TextBox ID="txtDOB" runat="server"></asp:TextBox> (MM/DD/YYYY)
<asp:Label ID="LableMsg" runat="server"
style="color: #FF0000; font-weight: 700"></asp:Label> <asp:Button ID="BtnCalculate" runat="server" Text="Calculate Age"
OnClientClick="CalculateAge(); return false;" style="font-weight: 700" />
</pre></td>
</tr>
</table>
</form>
</body>
</html>
Copy and Paste The Code In .cs page :
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class calage : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void BtnCalculate_Click(object sender, EventArgs e)
{
Response.Write(LableMsg);
}
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Calculate Age using JavaScript</title>
<script type="text/javascript">
function CalculateAge() {
var inputdob = document.getElementById("txtDOB").value;
//regular expression to validate date formate mm/dd/yyyy
var rex = /^(0[1-9]|1[012])[- /.](0[1-9]|[12][0-9]|3[01])[- /.](19|20)\d\d+$/;
if (rex.test(inputdob)) {
//convet to input date into Date object
var DOBDate = new Date(inputdob);
//get the current date
var currentDate = new Date();
var monthDiff = currentDate.getMonth() - DOBDate.getMonth();
var yearDiff = currentDate.getFullYear() - DOBDate.getFullYear();
var dayDiff = currentDate.getDate() - DOBDate.getDate();
if (isNaN(yearDiff)) {
document.getElementById("LableMsg").innerHTML = "Input date is incorrect.";
}
else {
if (monthDiff < 0 ) {
yearDiff = parseInt(yearDiff,10) - 1;
monthDiff= 12 + parseInt(monthDiff,10);
if(dayDiff < 0){
monthDiff = parseInt(monthDiff,10)-1;
dayDiff = 30 + parseInt(dayDiff,10);
document.getElementById('LableMsg').innerHTML = 'Age : ' + yearDiff + ' Years ' + monthDiff + ' Months ' + dayDiff + ' Days';
}
else{
document.getElementById('LableMsg').innerHTML = 'Age : ' + yearDiff + ' Years ' + monthDiff + ' Months ' + dayDiff + ' Days';
}
}
else {
if(monthDiff==0){
yearDiff = parseInt(yearDiff,10) - 1;
if(dayDiff < 0){
dayDiff = 30 + parseInt(dayDiff,10);
document.getElementById('LableMsg').innerHTML = 'Age : ' + yearDiff + ' Years ' + monthDiff + ' Months ' + dayDiff + ' Days';
}
else{
document.getElementById('LableMsg').innerHTML = 'Age : ' + yearDiff + ' Years ' + monthDiff + ' Months ' + dayDiff + ' Days';
}
}
else{
if(dayDiff < 0){
monthDiff = parseInt(monthDiff,10)-1;
dayDiff = 30 + parseInt(dayDiff,10);
document.getElementById('LableMsg').innerHTML = 'Age : ' + yearDiff + ' Years ' + monthDiff + ' Months ' + dayDiff + ' Days';
}
else{
document.getElementById('LableMsg').innerHTML = 'Age : ' + yearDiff + ' Years ' + monthDiff + ' Months ' + dayDiff + ' Days';
}
}
}
}
}
else {
document.getElementById('LableMsg').innerHTML = 'Date must be of mm/dd/yyyy format';
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<table>
<tr>
<td>
<pre class="code" style="background-color: white; border: 6px solid rgb(234, 234, 234); color: #444444; font-family: 'courier new'; font-size: 13px; line-height: 18px; outline: rgb(212, 212, 212) solid 1px; overflow: auto; padding: 15px; position: relative; text-align: justify; width: 600px;"><asp:Label ID="lblDOB" runat="server" Text="Enter Your Date of Birth : "
style="color: #3366FF"></asp:Label> : <asp:TextBox ID="txtDOB" runat="server"></asp:TextBox> (MM/DD/YYYY)
<asp:Label ID="LableMsg" runat="server"
style="color: #FF0000; font-weight: 700"></asp:Label> <asp:Button ID="BtnCalculate" runat="server" Text="Calculate Age"
OnClientClick="CalculateAge(); return false;" style="font-weight: 700" />
</pre></td>
</tr>
</table>
</form>
</body>
</html>
Copy and Paste The Code In .cs page :
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class calage : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void BtnCalculate_Click(object sender, EventArgs e)
{
Response.Write(LableMsg);
}
}
Good Airticle.........-)
ReplyDelete