Datepicker - Add events to datesDisabled

Asked

Viewed 55 times

0

I would like to add two events like, Alert (onclick) and on mouseover, specifically to the fields of disabled dates, datesDisabled.

The structure of my Datepicker is functional, I will show here the script:

<script type="text/javascript"> 
$('#date,#date2').datepicker({
    format: "dd/mm/yyyy",
    language: "pt-BR",
    keyboardNavigation: false,
    forceParse: false,
    autoclose: true,
    startDate: '+0d',
    datesDisabled: ['25/04/2019', '29/04/2019']
});
</script>
javascript datepicker

1 answer

1


Assign the events click and mouseover to class .disabled-date, which is the class of dates listed in the option array datesDisabled::

$(function(){
   $(document).on("click mouseover", ".disabled-date", function(){
      // faz alguma coisa
   });
});

Example:

$('#date,#date2').datepicker({
    format: "dd/mm/yyyy",
    language: "pt-BR",
    keyboardNavigation: false,
    forceParse: false,
    autoclose: true,
    startDate: '+0d',
    datesDisabled: ['25/04/2019', '29/04/2019']
});

$(function(){
   $(document).on("click mouseover", ".disabled-date", function(e){
      console.log(e.type);
   });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.0/css/bootstrap-datepicker3.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.0/js/bootstrap-datepicker.js"></script>
<input id="date">
<input id="date2">

Browser other questions tagged javascript datepicker

You are not signed in. Login or sign up in order to post.