yii2 datepicker disable dates using javascript

Question

I rewrited my question:

I'm using Kartick DatePicker to display a datepicker. On this datepicker, I want to disable dates using javascript. Here is what I have:

<?= DatePicker::widget([
    'name' => 'mydate',
          'language' => 'fr',
          'clientOptions' => [
              'autoclose' => true,
              'format' => 'dd-M-yyyy'
          ]
  ]);?>

With the JS:

 $(function(){
     $("#w0").datepicker("setDatesDisabled", ['25-08-2017']);
});

I tried to change the format of the date to 2017/08/25 or 08/25/2017 but in any case nothing is displayed into the logs.

I also tried to use kvDatepicker() instead of datepicker() but this gave me

Uncaught TypeError: $(...).kvDatepicker is not a function

Any clue on what is wrong here? Thank's.

Answer 1

Your date is in the wrong format. It should be specified as:

$("#w0").datepicker("setDatesDisabled", ['08/25/2017']);

Of course make sure that w0 is the correct ID for the input element... it might also be that your selector doesn't match the input .

I've verified on the demo page that entering this in the browser's console correctly disables Aug 28:

$('#sandbox-container input').datepicker("setDatesDisabled", ['08/28/2017']);

Answer 2

If you are using Yii2 Specifically than this may help you

    echo '<label id = "for-trigger">Date</label>';
                echo DatePicker::widget([
                    'type' => DatePicker::TYPE_INPUT,
                    'id' => 'anyUniqueID',
                    'name' => 'date',
                    'value' => '2020-04-11',
                    'options' => ['placeholder' => 'Selectdate ...'],
                    'pluginOptions' => [
                        'format' => 'yyyy-M-dd',
                        'daysOfWeekHighlighted' => '2,3',
                        'todayHighlight' => true,
                        'datesDisabled' => ['2020-04-06', '2020-04-21']
                    ],
                    'pluginEvents' => [
                        'changeDate' => "function(e) {  
                            //something you want to do may be 
                        }"
                    ]
                ]);