Yii2 super easy-to-use date component and time component, yii2 super date component
The date component is indispensable in normal development. Today, let's talk about the super-useful time components in yii2, which saves you a lot of effort to find js plug-ins.
Before sharing, let's preview the effect and see how it works.
Of course, the poor performance lies in the feeling of self. You cannot see the picture above. The good news is that these two plug-ins have been integrated with yii2, which is also very simple to use.
For the date component and the time component, the former is of the date ('Y-m-d') type, and the latter is of the date ('Y-m-d H: I: s') type ') type. Needless to say.
Let's take a look at the time component extension.
Since it is an extension component, the first step is to install it.
composer require kartik-v/yii2-widget-datetimepicker "*"
After the installation, if your form is generated using ActiveForm, you can refer to the following code
use kartik\datetime\DateTimePicker; <?= $form->field($model, 'created_at')->widget(DateTimePicker::classname(), [ 'options' => ['placeholder' => ''], 'pluginOptions' => [ 'autoclose' => true, 'todayHighlight' => true, ] ]); ?>
Some users who do not like to use ActiveForm to generate forms need to refer to the following usage.
Use kartik \ datetime \ DateTimePicker; echo '<label> time </label>'; echo DateTimePicker: widget (['name' => 'Article [created_at] ', 'options' => ['holder' => ''], // note, when updating this method, you must specify the value 'value' => '2017-05-03 22:10:10 ', 'ininoptions' => ['autoclose' => true, 'format' => 'yyyy-mm-dd HH: ii: ss', 'todayhighlight' => true]);
The convenience is self-evident.
The entire installation process is really simple. Next we will install the date component in the same way.
composer require kartik-v/yii2-widget-datepicker "@dev"
After the installation, we start to use the date component.
Use kartik \ date \ DatePicker; <? Php echo DatePicker: widget (['name' => 'Article [created_at] ', 'options' => ['placeholder' => '... '], // Add 'value' => '2017-05-03', 'ininoptions' => ['autoclose' => true, 'format' => 'yyyy-mm-dd', 'todayhighlight' => true,]);?>
After reading the above Code, you may have guessed the usage of the date component generated by ActiveForm. That's right. It's easy to use si.
<?= $form->field($model, 'created_at')->widget(DatePicker::classname(), [ 'options' => ['placeholder' => ''], 'pluginOptions' => [ 'autoclose' => true, 'todayHighlight' => true, 'format' => 'yyyy-mm-dd', ] ]); ?>
Of course, the preceding time formats can be adjusted. However, since the date component is a date, only three types of parameters of ymd are supported. Otherwise, what is the difference with the time component.
Some friends say that they are in English, which is inconvenient to use. I would like to ask if your project is not configured in Chinese? You only need to add 'language '=> 'zh-cn' to your configuration file.
Finally, let's look at the final result.