html dropdown 24 hour in and out issue
I have two drop downs one for a punch in and one for a punch out. They both are in 24 hour time so they have options from 0-23. Is there a way I can use javascript and php to make the out dropdown start a number greater than the chosen in drop down?
these are chunks of code, dont mind the open and closing of table tags
<td>Start Time</td>
<td>
<select name="hourIn" id="hourIn">
<option value="" selected></option>
开发者_如何学编程 <? for ($hour=0; $hour <= 23; $hour++): ?>
<option value="<?=$hour?>"><?=$hour?></option>
<? endfor ; ?>
</select>
<td>End Time</td>
<td>
<select name="hourOut" id="hourOut">
<option value="" selected></option>
<? for ($hour=0; $hour <= 23; $hour++): ?>
<option value="<?=$hour?>"><?=$hour?></option>
<? endfor ; ?>
</select>
Yes. If you are using jQuery, just do something like this:
$('#punchout').val($('#punchin').val()+1);
Of course, you will need to do something different when the punchin value is equal to 23 (mod 24
should do it). You also may be using a different format. Implementing a specific solution is something I leave to you, as you haven't given us enough information for anything else.
Yes, with JavaScript:
<!doctype html>
<html>
<head>
<title>Example</title>
</head>
<body>
<form name="myForm" action="#" method="post">
<select name="checkIn">
<!-- options -->
</select>
<select name="checkOut">
<!-- options -->
</select>
</form>
</body>
<script type="text/javascript">
var checkIn = document.forms["myForm"].elements["checkIn"],
checkOut = document.forms["myForm"].elements["checkOut"];
checkIn.onclick = function() {
if (this.value == 23) {
checkOut.value = 0;
}
else {
checkOut.value = this.value + 1;
}
}
checkOut.onclick = function() {
if (this.value <= checkIn.value) {
this.value = checkIn.value + 1;
}
}
</script>
</html>
You may need to fiddle with the logic for the edge cases, but that's the gist of it.
精彩评论