Class yii\jui\DatePicker
| Inheritance | yii\jui\DatePicker » yii\jui\InputWidget » yii\jui\Widget » yii\base\Widget |
|---|---|
| Available since extension's version | 2.0 |
| Source Code | https://github.com/yiisoft/yii2-jui/blob/master/DatePicker.php |
DatePicker renders a datepicker jQuery UI widget.
For example to use the datepicker with a \yii\base\Model:
echo DatePicker::widget([
'model' => $model,
'attribute' => 'from_date',
//'language' => 'ru',
//'dateFormat' => 'yyyy-MM-dd',
]);
The following example will use the name property instead:
echo DatePicker::widget([
'name' => 'from_date',
'value' => $value,
//'language' => 'ru',
//'dateFormat' => 'yyyy-MM-dd',
]);
You can also use this widget in an \yii\widgets\ActiveForm using the \yii\widgets\ActiveField::widget() method, for example like this:
<?= $form->field($model, 'from_date')->widget(\yii\jui\DatePicker::classname(), [
//'language' => 'ru',
//'dateFormat' => 'yyyy-MM-dd',
]) ?>
Note that and empty string ('') and null will result in an empty text field while 0 will be
interpreted as a UNIX timestamp and result in a date displayed as 1970-01-01.
It is recommended to add a
validation filter in your model that sets the value to null in case when no date has been entered:
[['from_date'], 'default', 'value' => null],
See also http://api.jqueryui.com/datepicker/.
Public Properties
| Property | Type | Description | Defined By |
|---|---|---|---|
| $attribute | string | The model attribute that this widget is associated with. | yii\jui\DatePicker |
| $clientEvents | array | The event handlers for the underlying jQuery UI widget. | yii\jui\Widget |
| $clientOptions | array | The options for the underlying jQuery UI widget. | yii\jui\Widget |
| $containerOptions | array | The HTML attributes for the container tag. | yii\jui\DatePicker |
| $dateFormat | string | The format string to be used for formatting the date value. | yii\jui\DatePicker |
| $inline | boolean | If true, shows the widget as an inline calendar and the input as a hidden field. | yii\jui\DatePicker |
| $language | string | The locale ID (e.g. 'fr', 'de', 'en-GB') for the language to be used by the date picker. | yii\jui\DatePicker |
| $model | \yii\base\Model | The data model that this widget is associated with. | yii\jui\InputWidget |
| $name | string | The input name. | yii\jui\InputWidget |
| $options | array | The HTML attributes for the widget container tag. | yii\jui\Widget |
| $value | string | The input value. | yii\jui\DatePicker |
Protected Properties
| Property | Type | Description | Defined By |
|---|---|---|---|
| $clientEventMap | array | Event names mapped to what should be specified in .on(). |
yii\jui\Widget |
Public Methods
| Method | Description | Defined By |
|---|---|---|
| init() | Initializes the widget. | yii\jui\DatePicker |
| run() | Renders the widget. | yii\jui\DatePicker |
Protected Methods
| Method | Description | Defined By |
|---|---|---|
| hasModel() | yii\jui\InputWidget | |
| registerClientEvents() | Registers a specific jQuery UI widget events | yii\jui\Widget |
| registerClientOptions() | Registers a specific jQuery UI widget options | yii\jui\Widget |
| registerWidget() | Registers a specific jQuery UI widget asset bundle, initializes it with client options and registers related events | yii\jui\Widget |
| renderWidget() | Renders the DatePicker widget. | yii\jui\DatePicker |
Property Details
The model attribute that this widget is associated with. The value of the attribute will be converted using \yii\i18n\Formatter::asDate() with the $dateFormat if it is not null.
The HTML attributes for the container tag. This is only used when $inline is true.
See also \yii\helpers\Html::renderTagAttributes() for details on how attributes are being rendered.
The format string to be used for formatting the date value. This option will be used
to populate the clientOption dateFormat.
The value can be one of "short", "medium", "long", or "full", which represents a preset format of different lengths.
It can also be a custom format as specified in the ICU manual.
Alternatively this can be a string prefixed with php: representing a format that can be recognized by the
PHP date()-function.
For example:
'MM/dd/yyyy' // date in ICU format
'php:m/d/Y' // the same date in PHP format
If not set the default value will be taken from Yii::$app->formatter->dateFormat.
If true, shows the widget as an inline calendar and the input as a hidden field.
The locale ID (e.g. 'fr', 'de', 'en-GB') for the language to be used by the date picker. If this property is empty, then the current application language will be used.
Since version 2.0.2 a fallback is used if the application language includes a locale part (e.g. de-DE) and the language
file does not exist, it will fall back to using de.
The input value. This value will be converted using \yii\i18n\Formatter::asDate() with the $dateFormat if it is not null.
Method Details
Defined in: yii\jui\InputWidget::hasModel()
| protected boolean hasModel ( ) | ||
| return | boolean |
Whether this widget is associated with a data model. |
|---|---|---|
protected function hasModel()
{
return $this->model instanceof Model && $this->attribute !== null;
}
Initializes the widget.
If you override this method, make sure you call the parent implementation first.
| public void init ( ) |
public function init()
{
parent::init();
if ($this->inline && !isset($this->containerOptions['id'])) {
$this->containerOptions['id'] = $this->options['id'] . '-container';
}
if ($this->dateFormat === null) {
$this->dateFormat = Yii::$app->formatter->dateFormat;
}
}
Defined in: yii\jui\Widget::registerClientEvents()
Registers a specific jQuery UI widget events
| protected void registerClientEvents ( $name, $id ) | ||
| $name | string |
The name of the jQuery UI widget |
| $id | string |
The ID of the widget |
protected function registerClientEvents($name, $id)
{
if (!empty($this->clientEvents)) {
$js = [];
foreach ($this->clientEvents as $event => $handler) {
if (isset($this->clientEventMap[$event])) {
$eventName = $this->clientEventMap[$event];
} else {
$eventName = strtolower($name . $event);
}
$js[] = "jQuery('#$id').on('$eventName', $handler);";
}
$this->getView()->registerJs(implode("\n", $js));
}
}
Defined in: yii\jui\Widget::registerClientOptions()
Registers a specific jQuery UI widget options
| protected void registerClientOptions ( $name, $id ) | ||
| $name | string |
The name of the jQuery UI widget |
| $id | string |
The ID of the widget |
protected function registerClientOptions($name, $id)
{
if ($this->clientOptions !== false) {
$options = empty($this->clientOptions) ? '' : Json::htmlEncode($this->clientOptions);
$js = "jQuery('#$id').$name($options);";
$this->getView()->registerJs($js);
}
}
Defined in: yii\jui\Widget::registerWidget()
Registers a specific jQuery UI widget asset bundle, initializes it with client options and registers related events
| protected void registerWidget ( $name, $id = null ) | ||
| $name | string |
The name of the jQuery UI widget |
| $id | string |
The ID of the widget. If null, it will use the |
protected function registerWidget($name, $id = null)
{
if ($id === null) {
$id = $this->options['id'];
}
JuiAsset::register($this->getView());
$this->registerClientEvents($name, $id);
$this->registerClientOptions($name, $id);
}
Renders the DatePicker widget.
| protected string renderWidget ( ) | ||
| return | string |
The rendering result. |
|---|---|---|
protected function renderWidget()
{
$contents = [];
// get formatted date value
if ($this->hasModel()) {
$value = Html::getAttributeValue($this->model, $this->attribute);
} else {
$value = $this->value;
}
if ($value !== null && $value !== '') {
// format value according to dateFormat
try {
$value = Yii::$app->formatter->asDate($value, $this->dateFormat);
} catch(InvalidParamException $e) {
// ignore exception and keep original value if it is not a valid date
}
}
$options = $this->options;
$options['value'] = $value;
if ($this->inline === false) {
// render a text input
if ($this->hasModel()) {
$contents[] = Html::activeTextInput($this->model, $this->attribute, $options);
} else {
$contents[] = Html::textInput($this->name, $value, $options);
}
} else {
// render an inline date picker with hidden input
if ($this->hasModel()) {
$contents[] = Html::activeHiddenInput($this->model, $this->attribute, $options);
} else {
$contents[] = Html::hiddenInput($this->name, $value, $options);
}
$this->clientOptions['defaultDate'] = $value;
$this->clientOptions['altField'] = '#' . $this->options['id'];
$contents[] = Html::tag('div', null, $this->containerOptions);
}
return implode("\n", $contents);
}
Renders the widget.
| public void run ( ) |
public function run()
{
echo $this->renderWidget() . "\n";
$containerID = $this->inline ? $this->containerOptions['id'] : $this->options['id'];
$language = $this->language ? $this->language : Yii::$app->language;
if (strncmp($this->dateFormat, 'php:', 4) === 0) {
$this->clientOptions['dateFormat'] = FormatConverter::convertDatePhpToJui(substr($this->dateFormat, 4));
} else {
$this->clientOptions['dateFormat'] = FormatConverter::convertDateIcuToJui($this->dateFormat, 'date', $language);
}
if ($language !== 'en-US') {
$view = $this->getView();
$assetBundle = DatePickerLanguageAsset::register($view);
$assetBundle->language = $language;
$options = Json::htmlEncode($this->clientOptions);
$language = Html::encode($language);
$view->registerJs("jQuery('#{$containerID}').datepicker($.extend({}, $.datepicker.regional['{$language}'], $options));");
} else {
$this->registerClientOptions('datepicker', $containerID);
}
$this->registerClientEvents('datepicker', $containerID);
JuiAsset::register($this->getView());
}