Question

我已将DateRangePicker小部件放在2个位置。首先是Bootstrap模式窗口，通过单击按钮打开该窗口。第二个我想在没有模态窗口的页面上显示。结果是它在模态窗口中正常工作，但页面上的第二个工作不正常，我的意思是它看起来和显示正确，但是当它点击字段时不显示日历。

模态中的代码是：

<div class="modal fade" id="responsive" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel4">Book</h4>
            </div>
            <div class="modal-body">
                <?php $form = ActiveForm::begin(); ?>
                    ...
                    <?= $form->field($model, 'start_date')->widget(DateRangePicker::className(), [
                        'attributeTo' => 'end_date', 
                        'language' => 'ru',
                        'labelTo' => 'до',
                    //    'size' => 'lg',
                        'clientOptions' => [
                            'autoclose' => true,
                            'format' => 'yyyy-mm-d',
                            'todayHighlight' => true,
                        ]
                    ])->label('Укажите период');?>                        
                    ...
                <?php ActiveForm::end(); ?>
            </div>
        </div>
    </div>
</div>

在页面上显示div：

<div>
    <?php $form = ActiveForm::begin(); ?>
        ...
        <?= $form->field($model, 'start_date')->widget(DateRangePicker::className(), [
            'attributeTo' => 'end_date', 
            'language' => 'ru',
            'labelTo' => 'до',
        //    'size' => 'lg',
            'clientOptions' => [
                'autoclose' => true,
                'format' => 'yyyy-mm-d',
                'todayHighlight' => true,
            ]
        ])->label('Укажите период');?>                        
        ...
    <?php ActiveForm::end(); ?>
</div>

P.S。使用DatePicker小部件时存在同样的问题。还有一个时刻我又添加了一个模态，它也没有在那里工作。仅限于第一模态。

还有一刻：我尝试添加简单的DatePicker小部件而不使用模型。

<?= DatePicker::widget([
'name' => 'Test',
'value' => '02-16-2012',
'template' => '{addon}{input}',
    'clientOptions' => [
        'autoclose' => true,
        'format' => 'dd-M-yyyy'
    ]
]);?>

当我使用模型添加此小部件时出现问题。

Answer 1

我认为您的问题发生的原因是您为这两个小部件使用了相同的模型属性。因此，一个页面有两个具有相同id和name属性的输入。在这种情况下，JS库无法正确处理它们。只是尝试使用其他属性名称作为第二个小部件。它可能有所帮助。

PS：我不确定，但可能存在为第二个小部件定义其他id和name的方式（可能使用clientOptions）。它取决于JS库及其版本。

Yii2 + 2amigos DateRangePicker模块。不能正常工作

1 个答案: