Yii2: wrong datepicker location

Question

I've added 2amigos datepicker for Yii2 (https://github.com/2amigos/yii2-date-picker-widget) to my form.

However the datepicker is rendered a few lines above the actual input field, as seen in the screenshot below:

The datepicker should be displayed just above the "Create time" field. I've also tried Kartik's DatePicker, same results.

My code is:

<?php

use dosamigos\datepicker\DatePicker;

    <?= $form->field($model, 'create_time')->widget(DatePicker::className(), [
        'template' => '{input}{addon}',
        'clientOptions' => [
            'autoclose' => true,
            'format' => 'yyyy-mm-dd'
        ]
    ]) ?>

The rest of the form is generated with Yii2 CRUD generator.

Answer 1

Try using the widget in this manner:

<?php echo '<label class="control-label">Create Time</label>'; ?>
<?= DatePicker::widget([
    'attribute' => 'create_time',
    'model' => $model,
    //'language' => 'ru',
    'dateFormat' => 'dd-MM-yyyy',
    ]) ?>

Hope this helps.

Answer 2

Try with inline => true:

<?= $form->field($model, 'create_time')->widget(DatePicker::className(), [
    'template' => '{input}{addon}',
    'inline' => true, 
    'clientOptions' => [
        'autoclose' => true,
        'format' => 'yyyy-mm-dd'
    ]
]) ?>

For more Configuration option.

• http://bootstrap-datepicker.readthedocs.org/en/release/

Answer 3

I also faced this issue. Check for any margin-top attribute that is applied to the body and change it to padding-top

body {
  color: #73879C;
  background: #fff;
  font-family: "Helvetica Neue", Roboto, Arial, "Droid Sans", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.471;
  /*margin-top: 58px;*/
  padding-top: 58px;
}

it will solve your issue!!!