javascript - Prevent user enter greater value in textbox -
i have 2 texbox first has start time end second user should enter end time both on format (00:00:00). how can prevent user enter value in second textbox inferior fist one, endtime must superior start time, message should warn him. behold codes:
<input type="text" name="starttime" id="starttime" size="30" value="<?php echo $tab['starttime'];?>" readonly="readonly" /></td></tr> <tr><td> <label>end time</label> </td> <td> <input type="text" name="endtime" id="endtime" value="00:00:00" max="23:00" size="30" required pattern="[0-2][0-9]:[0-5][0-9]: [0-5][0-9]" title="please enter end time format (00:00:00),maximum value is: 23: 59: 59"/></td></tr>
if start time instance 08:00:00 , user enter 07:00:00 message should pop warn him. thank you
the validation triggered when user/focus leaves 1 of textfields after changing it. can trigger time want.
html:
starttime: <input type="text" name="starttime" id="starttime" size="30" value="08:00:00" /> <br> <br> endtime: <input type="text" name="endtime" id="endtime" size="30" value="16:00:00" />
javascrip:
function validateendtimegreaterstarttime() { var valuestarttime = document.getelementbyid( 'starttime' ).value; var valueendtime = document.getelementbyid( 'endtime' ).value; return date.parse( '01/01/2015 ' + valueendtime ) > date.parse( '01/01/2015 ' + valuestarttime ); }; var elementstarttime = document.getelementbyid( 'starttime' ); var elementendtime = document.getelementbyid( 'endtime' ); elementstarttime.onchange = function() { if ( !validateendtimegreaterstarttime() ) { alert( "endtime should greater starttime" ); } }; elementendtime.onchange = function() { if ( !validateendtimegreaterstarttime() ) { alert( "endtime should greater starttime" ); } };
jsfiddle: https://jsfiddle.net/lz60s0gp/
Comments
Post a Comment