Code:
How can I calculate duration in seconds for more rows from two times?
<!--Time calculation-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function() {
//this calculates values automatically
sum();
$("#start_time, #end_time").on("keydown keyup", function() {
sum();
});
});
function sum() {
var start_time = document.getElementById('start_time').value;
var end_time = document.getElementById('end_time').value;
var result = parseInt(end_time) - parseInt(start_time);
if (!isNaN(result)) {
document.getElementById('sum').value = result;
}
}
</script>
<!--add row-->
<script>
function addRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var colCount = table.rows[0].cells.length;
row.id = 'row_'+rowCount;
for (var i = 0; i < colCount; i++) {
var newcell = row.insertCell(i);
newcell.outerHTML = table.rows[0].cells[i].outerHTML;
}
}
function deleteRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
for (var i = 0; i < rowCount; i++) {
var row = table.rows[i];
var chkbox = row.cells[0].childNodes[0];
if (null !== chkbox && true === chkbox.checked) {
if (rowCount <= 1) { // limit the user from removing all the fields
alert("Cannot Remove all the Passenger.");
break;
}
table.deleteRow(i);
rowCount--;
i--;
}
}
}
</script>
<!--form-->
<form method="post" action="action_entry_history.php" name="form">
<TABLE id="dataTable" width="100%" border="1" align="center">
<tr id='row_0'>
<td><INPUT type="checkbox" size="5" name="chk"/></td>
<td><input type="time" name="start_time[]" size="5" id="start_time" step="1" placeholder="HH:MM:SS"/></td>
<td><input type="time" name="end_time[]" size="5" id="end_time" step="1" placeholder="HH:MM:SS"/></td>
<td><input type="text" id="sum" size="5" name="duration[]" placeholder="Duration" readonly></td>
</tr>
</table>
<INPUT type="button" value="Add Row" onClick="addRow('dataTable')" />
<INPUT type="button" value="Delete Row" onClick="deleteRow('dataTable')" />
<input type="submit" value="Submit" name="submit">
</form>
Comment