Javascript Yii2 kartik DatePicker如何在单击日期时选择整周

我试图用kartik datepicker将这段代码从Yii2问题的示例答案中移除 但在运行和选定日期之后，不会通过单击来选择该周

<?php
use kartik\date\DatePicker;
use yii\web\JsExpression;

$this->registerJs(
    <<<JS
$(function(){
   var startDate;
   var endDate;

   var selectCurrentWeek = function() {
        window.setTimeout(function () {
            $('.datepicker').find('.ui-datepicker-current-day a').addClass('ui-state-active')

        }, 1);
    }
});
JS
);

echo DatePicker::widget(
    [
        'model' => $searchModel,
        'attribute' => 'period_start',
        'language' => 'en',
        'class' => 'datepicker',
        'type' => DatePicker::TYPE_INPUT,
        'pluginOptions' => [
            'calendarWeeks' => true,
            'autoclose' => true,
            'format' => 'yyyy-mm-dd',
            'updateViewDate' => false,
            'onSelect' => new JsExpression(
                'function(dateText, inst) {
                        var date = $(this).datepicker(\'getDate\');
                        startDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay());
                        endDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 6);
                        var dateFormat = inst.settings.dateFormat || $.datepicker._defaults.dateFormat;
                        $(\'#startDate\').text($.datepicker.formatDate( dateFormat, startDate, inst.settings ));
                        $(\'#endDate\').text($.datepicker.formatDate( dateFormat, endDate, inst.settings ));

                        selectCurrentWeek();
                        }
                '
            ),
            'beforeShowDay' => new JsExpression(
                'function (date) {
                        startDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay());
                        endDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 6);
                        var cssClass = \'\';
                        if(date >= startDate && date <= endDate)
                        cssClass = \'ui-datepicker-current-day\';
                        return [true, cssClass];
                    }
                '
            )

        ]
    ]
);

---

您所指的帖子正在使用，您正在尝试将该解决方案与使用的
kartik\date\DatePicker
一起使用。因此，在使用任何yii扩展时，都需要仔细阅读文档或指南

现在，关于如何使其工作，您可以使用。最新的jui日期选择器不再具有
自动关闭
选项，并为您提供
内联
选项，该选项将显示内联日期选择器并隐藏字段

我将复制您提到的同一个示例，您可以看到选择的整个星期

<?php
use yii\helpers\Html;
// use kartik\date\DatePicker;
use yii\jui\DatePicker;
use yii\web\JsExpression;

$this->registerJs(
    <<<JS

   var startDate;
   var endDate;

   var selectCurrentWeek = function() {
        window.setTimeout(function () {
            console.log('called');
            $('.hasDatepicker').find('.ui-datepicker-current-day a').addClass('ui-state-active')
        }, 1);
    }

JS
);
echo DatePicker::widget([
    'model' => $searchModel,
    'attribute' => 'period_start',
    'inline' => true,
    'clientOptions' => [
        'selectOtherMonths' => true,
        'onSelect' => new JsExpression(
            "function(dateText, inst) {
                var date = $(this).datepicker('getDate');
                startDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay());
                endDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 6);
                var dateFormat = inst.settings.dateFormat || $.datepicker._defaults.dateFormat;
                selectCurrentWeek();
            }"
        ),
        'beforeShowDay' => new JsExpression(
            "function(date) {
                    var cssClass = '';
                    if(date >= startDate && date <= endDate)
                        cssClass = 'ui-datepicker-current-day';
                    return [true, cssClass];
                }"
        ),
        'onChangeMonthYear' => new JsExpression(
            "function(year, month, inst) {
                selectCurrentWeek();
            }"
        )
    ]

]);

您所指的帖子正在使用，您正在尝试将该解决方案与使用的
kartik\date\DatePicker
一起使用。因此，在使用任何yii扩展时，都需要仔细阅读文档或指南

现在，关于如何使其工作，您可以使用。最新的jui日期选择器不再具有
自动关闭
选项，并为您提供
内联
选项，该选项将显示内联日期选择器并隐藏字段

我将复制您提到的同一个示例，您可以看到选择的整个星期

<?php
use yii\helpers\Html;
// use kartik\date\DatePicker;
use yii\jui\DatePicker;
use yii\web\JsExpression;

$this->registerJs(
    <<<JS

   var startDate;
   var endDate;

   var selectCurrentWeek = function() {
        window.setTimeout(function () {
            console.log('called');
            $('.hasDatepicker').find('.ui-datepicker-current-day a').addClass('ui-state-active')
        }, 1);
    }

JS
);
echo DatePicker::widget([
    'model' => $searchModel,
    'attribute' => 'period_start',
    'inline' => true,
    'clientOptions' => [
        'selectOtherMonths' => true,
        'onSelect' => new JsExpression(
            "function(dateText, inst) {
                var date = $(this).datepicker('getDate');
                startDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay());
                endDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 6);
                var dateFormat = inst.settings.dateFormat || $.datepicker._defaults.dateFormat;
                selectCurrentWeek();
            }"
        ),
        'beforeShowDay' => new JsExpression(
            "function(date) {
                    var cssClass = '';
                    if(date >= startDate && date <= endDate)
                        cssClass = 'ui-datepicker-current-day';
                    return [true, cssClass];
                }"
        ),
        'onChangeMonthYear' => new JsExpression(
            "function(year, month, inst) {
                selectCurrentWeek();
            }"
        )
    ]

]);