how to use yii2 jui/datapicker widget?

Question

I have added jui to my project by composer and want to use the datepicker in an active form like this:

<?php
use yii\helpers\Html;
use yii\widgets\ActiveForm;
use yii\jui\DatePicker;

$form = ActiveForm::begin();
?>

<?= $form->field($course, 'created')->widget(\yii\jui\DatePicker::classname(), [
    //'language' => 'ru',
    //'dateFormat' => 'yyyy-MM-dd',
]) ?>

<?php Html::submitButton("submit"); ?>

<?php ActiveForm::end();?>

Now there is two problem. 1. the datepicker shows like a simple input text html element with now calender 2. my submit button is not showed in page (even in inspect element There is no sign of the existance of the button) I have used this but my problem about datapicker still exist

UPDATE 1: This is my error in console

Uncaught SyntaxError: Unexpected end of input
jquery-3.2.1.min.js:2 jQuery.Deferred exception: jQuery(...).datepicker is not a function TypeError: jQuery(...).datepicker is not a function
    at HTMLDocument.<anonymous> (http://localhost/panel/course/add:295:27)
    at j (http://localhost/panel/js/jquery-3.2.1.min.js:2:29999)
    at k (http://localhost/panel/js/jquery-3.2.1.min.js:2:30313) undefined
r.Deferred.exceptionHook @ jquery-3.2.1.min.js:2
k @ jquery-3.2.1.min.js:2
setTimeout (async)
(anonymous) @ jquery-3.2.1.min.js:2
i @ jquery-3.2.1.min.js:2
fireWith @ jquery-3.2.1.min.js:2
fire @ jquery-3.2.1.min.js:2
i @ jquery-3.2.1.min.js:2
fireWith @ jquery-3.2.1.min.js:2
ready @ jquery-3.2.1.min.js:2
S @ jquery-3.2.1.min.js:3
jquery-3.2.1.min.js:2 Uncaught TypeError: jQuery(...).datepicker is not a function
    at HTMLDocument.<anonymous> (add:295)
    at j (jquery-3.2.1.min.js:2)
    at k (jquery-3.2.1.min.js:2)

Add `echo` to your `submitButton()` method. About DatePicker - what say's console in your browser? — Yupik, Oct 30 '17 at 12:55

score 0 · Answer 1 · answered Oct 30 '17 at 13:58

The following should output input field that shows the calendar on click.

   <?= $form->field($course, 'created')->widget(\yii\jui\DatePicker::className(), [
        //'language' => 'ru',
        //'dateFormat' => 'yyyy-MM-dd',
    ]) ?>

The following should output the calendar (note the inline attribute).

   <?= $form->field($course, 'created')->widget(\yii\jui\DatePicker::className(), [
        //'language' => 'ru',
        //'dateFormat' => 'yyyy-MM-dd',
        'inline' => true
    ]) ?>

Here is Yii2 official documentation for JUI Datepicker widget.

As for the button - you are not echoing it. You can write

<?php echo Html::submitButton("submit"); ?>

or (since PHP 5.4.0)

<?= Html::submitButton("submit"); ?>

how to use yii2 jui/datapicker widget?

1 Answers1