<head runat="server">
<title>Hour::
Minute Calculation from JQuery</title>
<script language="javascript" type="text/javascript" src="~/jquery-1.4.1.js"></script>
<script language="javascript" type="text/javascript" src="~/jquery-1.4.1.min.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function () {
var realmin = 0;
var
totalHrFrmMin = 0;
$('.min').keyup(function
() {
var totalMin = 0;
$(".min").each(function
() {
totalMin +=
Number($(this).val());
});
realmin =
totalMin % 60 //taking the value of min
$("#txtTotalMin").val(realmin.toFixed(2)); //assign the
min value
totalHrFrmMin =
Math.floor(totalMin / 60) // calculating total hour from min
var totlHour = getHourOnly(); //
calculating total hour from hour
$("#txtTotalHr").val(totalHrFrmMin +
totlHour); //assigning
total Hour value after addition of total hour from min and total hour
});
//calculating hour value from textboxes
$(".hh").keyup(function
() {
var addHour = 0;
$(".hh").each(function
() {
addHour +=
Number($(this).val());
});
$("#txtTotalHr").val(addHour +
totalHrFrmMin);
});
});
//getting hour value after assinged from hour textboxes
function getHourOnly() {
var addHour = 0;
$(".hh").each(function
() {
addHour +=
Number($(this).val());
});
return addHour;
}
</script>
</head>
<div>
Hh : <asp:TextBox ID="txtH1" runat="server"
CssClass="hh"></asp:TextBox> Mm : <asp:TextBox ID="txtM1" runat="server" CssClass="min"></asp:TextBox><br />
Hh : <asp:TextBox ID="txtH2" runat="server"
CssClass="hh"></asp:TextBox> Mm : <asp:TextBox ID="txtM2" runat="server" CssClass="min"></asp:TextBox><br />
Hh : <asp:TextBox ID="txtH3" runat="server"
CssClass="hh"></asp:TextBox> Mm : <asp:TextBox ID="txtM3" runat="server" CssClass="min"></asp:TextBox><br /><br />
Total Hour : <asp:TextBox ID="txtTotalHr"
runat="server"></asp:TextBox>
Total Minute : <asp:TextBox ID="txtTotalMin"
runat="server"></asp:TextBox>
</div>
Comments