使用 DatePicker 处理日期输入

使用 DatePicker 小部件,从而便捷的使用户进行日期输入。 在下面的例子中,我们将使用一个 Task 模型(model),它有一个 deadline 属性,用户通过 ActiveForm 进行输入。 属性值将作为 unix 时间戳存储在数据库中。

在这种情况下,有3个组件一起使用:

  • DatePicker 用于在表单中显示模型属性的输入字段。
  • formatter ,负责向用户显示日期格式。
  • DateValidator 用于验证用户输入并将其转换为unix时间戳。

首先,我们通过 yii\widgets\ActiveField::widget() 方法将日期选择器添加到表单中:

<?= $form->field($model, 'deadline')->widget(\yii\jui\DatePicker::className(), [
    // if you are using bootstrap, the following line will set the correct style of the input field
    'options' => ['class' => 'form-control'],
    // ... you can configure more DatePicker properties here
]) ?>

然后在 模型验证规则 中配置日期验证器:

public function rules()
{
    return [
        // ...

        // ensure empty values are stored as NULL in the database
        ['deadline', 'default', 'value' => null],

        // validate the date and overwrite `deadline` with the unix timestamp
        ['deadline', 'date', 'timestampAttribute' => 'deadline'],
    ];
}

我们还添加了一个 默认值过滤 ,以确保在数据库中将空值存储为 NULL 。 如果的日期值为 必填)则可忽略此项。

日期选择器和日期验证器的默认格式是 Yii::$app->formatter->dateFormat 的值,因此可以使用此属性来配置整个应用程序的日期格式。 要更改日期格式,可通过配置 yii\validators\DateValidator::formatyii\jui\DatePicker::$dateFormat