Skip to content Skip to sidebar Skip to footer

Activate Button When Two Datepickers Fields Have Values

My Question derivate from this post I would like to disable a submit button until two input are filled in with a datepicker. I have no trouble doing it with standart text input but

Solution 1:

I guess problem is with keyup.Normally when you select a date from datepicker keyup is not called.

It will work when you manually insert a date in datepicker text field. Try using change with keyup event as

<script>
$(':text').on('change keyup', function() {
if($('#datepicker1').val() != "" && $('#datepicker2').val() != "") {
   $('#submit').removeAttr('disabled');
} else {
   $('#submit').attr('disabled', true);   
}
});
</script>

Hope this helps...

Solution 2:

EDIT

As oldPadawan said use onSelect when you initialize the datePicker to chekc for the value:

(function(){
   $( "#datepicker1" ).datepicker({ dateFormat:'dd/mm/yy',minDate: newDate(2016,04 - 1, 21), maxDate : newDate(2016, 05 - 1, 04),onSelect: 
        function(date) {
           checkDatePicker();
        }});
    $( "#datepicker2" ).datepicker({ dateFormat: 'dd/mm/yy' ,  minDate: newDate(2017, 04 - 1, 21), maxDate : newDate(2017, 05 - 1, 04),onSelect: 
        function(date) {
           checkDatePicker();
        }});    
})();

functioncheckDatePicker(){
    if($('#datepicker1').val() != "" && $('#datepicker2').val() != "") {
        $('#submit').removeAttr('disabled');
    } else {
        $('#submit').attr('disabled', true);   
    }
}

Post a Comment for "Activate Button When Two Datepickers Fields Have Values"