javascript - Validate the date in html drop-down list -
i have 3 html drop down lists select year, month , date. if selected year equal current year second , third lists show month , date current date. want code in javascript. here problem facing is, when user select date or month @ first how execute?
example below. if month , day selected first, not change unless selected value no longer valid. if not valid, reset 1.
html
<body> <select name="month" id="month"></select> <select name="day" id="day"></select> <select name="year" id="year"></select> </body>
javascript (w/jquery)
<script type ="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> <script type="text/javascript"> $( document ).ready(function() { var year = new date().getfullyear(); // load years (var i=2000; i<=year; i++) $("#year").append('<option value=' + + '>' + + '</option>'); // load months (var i=1; i<=12; i++) $("#month").append('<option value=' + + '>' + + '</option>'); // load days (var i=1; i<=31; i++) $("#day").append('<option value=' + + '>' + + '</option>'); }); $(function() { $('#year').change(function() { var = new date(); if ($('#year').val()==now.getfullyear()) { $('#month option').each(function() { if ($(this).val()>(now.getmonth()+1)) $(this).remove(); }); } else { (var i=1; i<13; i++) if ($("#month option[value='" + + "']").val()==undefined) $("#month").append('<option value=' + + '>' + + '</option>'); } checkmonth(); }); $('#month').change(checkmonth); }); function checkmonth() { var = new date(); if ($('#year').val()==now.getfullyear() && $('#month').val()==(now.getmonth()+1)) { $('#day option').each(function() { if ($(this).val()>now.getdate()) $(this).remove(); }); } else { var days = 31; var month = $('#month').val(); if (month==2) { if (($('#year').val() % 4) == 0) days = 29; // leap year else days = 28; } else if (month==2 || month==4 || month==6 || month==9 || month==11) { days = 30; } (var i=1; i<32; i++) if (i>days) $("#day option[value='" + + "']").remove(); else if ($("#day option[value='" + + "']").val()==undefined) $("#day").append('<option value=' + + '>' + + '</option>'); } } </script>
Comments
Post a Comment