How to choose daterangepicker only year in Yii2?

Question

I need help with daterangepicker expander in YII 2. I need to change the selection range only in year format. I am using https://github.com/kartik-v/yii2-date-range

I need to choose the date 2000-2005, 1990-2000 .... only a year without a month and date. I found this option only in the base datepicker bootstrap base.

Answer 1

What have you tried to implement so far so that we can help you more and add code to your question, which will also help.

I would suggest that you try clientoption and try to turn off the display of the month and date and go to this kartik website where documents are available and read the options above as your own third-party tool, than it can have limitations and can be explained more on the official widget site

Hope this helps

Answer 2

Looking at the documentation for the plugin, the Kartik Widget is based on the fact that you do what you want, it seems impossible, but Yii2 already has this functionality built-in :

1, Add this css to hide everything in the calendar widgets except year

 <style type="text/css"> .ui-datepicker-calendar { display: none; } </style> 

2, use the Yii built-in widget, change class and model names to reflect your actual project

 echo $form->field($model, 'time_scheduled')->widget(\yii\jui\DatePicker::classname(), [ 'clientOptions' => [ 'changeMonth' => false, 'changeYear' => true, 'showButtonPanel' => true, 'dateFormat' => 'yyyy', 'yearRange' => '1990:2020' ], ]); 

3, when testing, I found that I need to add this javascript too (but there may be a better way)

 $(document.body).on('click', '.ui-datepicker-close', function (e) { var value = $('.ui-datepicker-year :selected').text(); $('#feed-time_scheduled').val(value); }); 

Yii uses bootprap datepicker, and opions for this is here .

Answer 3

 echo DatePicker::widget([ 'model' => $model, 'attribute' => 'start_date', 'options' => ['placeholder' => 'Start date'], 'type' => DatePicker::TYPE_COMPONENT_PREPEND, 'form' => $form, 'pluginOptions' => [ 'format' => 'mm/yyyy', 'autoclose' => true, 'minViewMode' => 1, ] ]);