Date Picker Not working in yii2 Advanced - php

I am new to the Yii2 Advanced framework and am trying to insert a datepicker in an active form from a model.
I am using 2amigos widgets for date picker and updated my composer.json.
This is my code for Active Form
use dosamigos\datepicker\DatePicker;
<?= $form->field($model, 'user_date_birth')->widget(DatePicker::className(), [
// inline too, not bad
'inline' => true,
// modify template for custom rendering
'template' => '<div class="well well-sm" style="background-color: #fff; width:250px">{input}</div>',
'clientOptions' => [
'autoclose' => true,
'format' => 'dd-M-yyyy'
]
]);?>
but it does not show the datepicker on click and no errors are displayed.
How can I update my code to display the datepicker?

Nothing is wrong in your code ... but i think there is a problem in jquery .. add it in your AppAsset.php

Related

Yii2 JUI datepicker removes HTML attribute from input field

I have a yii2 ActiveForm field with a HTML5 "form" attribute like this:
$form->field($model, 'event_date', [
'inputOptions' => ['form' => 'starterWizard__form']
])->label('Enter date:');
If I apply a jQueryUI datepicker to this field in yii2 like below, the "form" attribute no longer gets inserted on input field.
$form->field($model, 'event_date', [
'inputOptions' => ['form' => 'starterWizard__form']
])->label('Enter date:')->widget(\yii\jui\DatePicker::class, ['dateFormat' => 'yyyy-MM-dd']);
Any idea why the widget removes "form" attribute from input field and how I can fix the issue?
When using widget to render a dynamic tag, it's moved away from the form and is only accessible in the controller via the $_POST[] array,
you will have to use
$model->attributes
and before that check :
isset($_POST['ModelName'])

Using more than one widget in an attribute INPUT_WIDGET on kartik Form Builder

So I am doing a form using the kartik form builder and I am using the input_widget kartik\date\datepicker. When I use the datepicker only it submits but when I go to the item view the date is set like 30/11/-0001. The solution I found when I first had this problem was using not only the date picker but also the date control (also from kartik). But at that time I was using the default yii form and it was possible to use multiple widgets in a single attribute. Now im using the kartik form builder and i cant set more than one widget and its class. How can I do to use both date picker and date control in a single attribute at kartik's form build or, if anyone knows, how to solve this problem without having to add the date control?
before it was like:
<?= $form->field($model, 'validadeCertificado')
->textInput()
->widget(DatePicker::classname(), [
'pluginOptions' => [
'autoclose'=>true,
]
])
->widget(DateControl::className(), [
'type'=>DateControl::FORMAT_DATE,
'ajaxConversion'=>false,
'widgetOptions' => [
'pluginOptions' => [
'autoclose' => true,
'language' => 'pt-BR',
]
]
]);
?>
now it is like:
echo Form::widget([ // 3 column layout
'model'=>$model,
'form'=>$form,
'columns'=>12,
'compactGrid'=>true,
'attributes'=>[
'validadeCertificado'=>[
'type'=>Form::INPUT_WIDGET,
'widgetClass'=>'\kartik\date\DatePicker',
'options' => [
'pluginOptions' => [
'format' => 'dd-mm-yyyy',
'autoclose'=>true,
'todayHighlight' => true
],
],
'columnOptions'=>['colspan'=>3],
],
<!--(other attributes)-->
]
]);```
I just wanted the date to be correctly inserted in the mysql database but it is inserted into the database as 0000-00-00
Heeeelp

Kartik Select 2 - Programatically changing multiple

I have a yii2 activeform where the functionality of the form can change based on other things within the form. So, I have a clubs field, that can be multiple in some instances but not multiple in others.
<?= $form->field($model, 'clubs')->widget(\kartik\widgets\Select2::classname(), [
'data' => $club_data,
'hideSearch' => false,
'options' => ['placeholder' => 'Add Club(s)'],
'pluginOptions' => [
'allowClear' => true,
'multiple' => true,
'minimumInputLength' => 3,
'ajax' => [
'url' => 'web/index.php?r=clubs/clubslist',
'dataType' => 'json',
'data' => new JsExpression('function(params) { return {q:params.term}; }'),
],
],
])->label('Club(s)'); ?>
I need to programmatically change the multiple pluginOption to true and false. This should be when the user goes into the form but also immediately when a dropdown is changed on the form. I can do it when the user initially goes into the form but not immediately when another dropdown is changed.
I've made separate fields, one actually linked to a field in the database and another not, this kind of works but it's far from elegant!
I've looked in both the kartik select2 documentation and the standard jquery select2 documentation and I can't spot anything. Any help or pointers would be much appreciated.
Reference
I was working on a Yii2-formwizard plugin a few months back where I had a situation of providing tabular functionality and cloning the fields really became the pain in the ass when it came to using 3rd party plugins like Select2 and Datepicker and I figured out the following code along with a lot of other (as the other part isn't relevant to your problem so not adding it).
Approach to the problem
The way Kartik-select2 works it stores the select2 plugin-specific options in the data-krajee-select2 attribute of the element you are using the select2 on.
And the theme or say the Kartik's plugin-specific options like theme and others are saved in the variable whose name is saved in the data-s2-options attribute. You can look for both of them in view-source of the page where you are using it.
Solution
So what you need to do is to
Steps
Get the applied options
Add/Update the option
Apply back the options
As you just added a single field and not the other one on who's selection it would change, I would demonstrate an example where you can change the behavior of the select2 from multiple to single using 2 different buttons, clicking on the relevant button the select2 will work accordingly. You can adjust the javascript code where ever you want to.
But before I add any code you need to fix one thing, you don't need the main data option when you are using the ajax option inside the plugin options. In other words, it does not have any effect on your select2 and is adding page load time only you should remove it.
You select2 should look like below, I added id to the options of the select2 for the example you can change it to the active form formatted name like model-field_name format if you like, but don't forget to change the id in the javascript code too
<?php echo $form->field($model, 'clubs')->widget(\kartik\widgets\Select2::classname(), [
'hideSearch' => false,
'options' => ['placeholder' => 'Add Club(s)','id'=>'clubs'],
'pluginOptions' => [
'allowClear' => true,
'multiple' => true,
'minimumInputLength' => 3,
'ajax' => [
'url' => 'web/index.php?r=clubs/clubslist',
'dataType' => 'json',
'data' => new JsExpression('function(params) { return {q:params.term}; }')
]
]
])->label('Club(s)');?>
Add the following buttons on your page
echo Html::button('multiple', ['class' => 'btn btn-info', 'id' => 'multi']);
echo Html::button('single', ['class' => 'btn btn-info', 'id' => 'single']);
And now the magic thing, add it on the top of your view
$js = <<<JS
var element=$("#clubs");
$('#multi').on('click',function(e){
//reset select2 values if previously selected
element.val(null).trigger('change');
//get plugin options
let dataSelect = eval(element.data('krajee-select2'));
//get kartik-select2 options
let krajeeOptions = element.data('s2-options');
//add your options
dataSelect.multiple=true;
//apply select2 options and load select2 again
$.when(element.select2(dataSelect)).done(initS2Loading("clubs", krajeeOptions));
});
$('#single').on('click',function(e){
element.val(null).trigger('change');
let dataSelect = eval(element.data('krajee-select2'));
let krajeeOptions = element.data('s2-options');
dataSelect.multiple=false;
$.when(element.select2(dataSelect)).done(initS2Loading("clubs", krajeeOptions));
});
JS;
$this->registerJs($js, \yii\web\View::POS_READY);
Now if your select2 is working correctly click on the multiple button and you will see the multiple selections are enabled for the select2 and when clicked on the single button.
Hope it helps.

Yii2 custom pagination view

Hello everybody.
I need to do a custom pagination for the GridView.
In GridView I used:
'pager' => [
'prevPageLabel' => '<div style="border: none" class="glyphicon glyphicon-menu-left"></div>',
'nextPageLabel' => '<div style="border: none" class="glyphicon glyphicon-menu-right"></div>',
'maxButtonCount' => 0,
]
As a result, I get two arrows and then I can style them:
Question: How to put your own content between these arrows?
For example, I can get count of page: <?= $dataProvider->totalCount; ?> and I want to put this total count of pages between the arrows of pagination. How can I do this?Thanks!
You can extend LinkPager class, override renderPageButtons() to generate whatever content you like and then use this extended class in GridView configuration:
'pager' => [
'class' => 'new\extended\LinkPager'
]

Yii2 - jui datepicker extension - display current timestamp by default

i'm using Yii2 extension - Jui DatePicker.
Is there a way to show by default the current timestamp in the text box, so the user does not need to input it every time it fills de form fields?
My view, and the form in Yii2:
<?= $form->field($model, 'data')->widget(DatePicker::className(),
[
'language' => 'en',
'inline' => false,
'clientOptions' =>[
'dateFormat' => 'yyyy-MM-dd',
'showAnim'=>'fold',
'yearRange' => 'c-25:c+0',
'changeMonth'=> true,
'changeYear'=> true,
'autoSize'=>true,
'showOn'=> "button",
'buttonText' => 'clique aqui',
//'buttonImage'=> "images/calendar.gif",
]])
?>
In Yii1 i used to write the code like this (inside the widget), and the timestamp appeared by default:
'htmlOptions'=>array('size'=>12, 'value'=>CTimestamp::formatDate('d/m/Y')),
Is there an equivalent in Yii2?
Many thanks...
You can still use value:
<?= $form->field($model, 'data')->widget(DatePicker::className(),
[
'language' => 'en',
...
'value' => date('Y-m-d'),
As noted in a comment (haven't confirmed this)
'value' => date('Y-m-d') parameter will work only if widget is used without model: DataPicker::widget(['value' => date('Y-m-d')])
Therefore you can use clientOptions to set defaultDate :
'clientOptions' => ['defaultDate' => date('Y-m-d')]
Or better yet you can set $model->data to a default value of the current timestamp, either in your view or in the model.
if (!$model->data) $model->data = date('Y-m-d');

Categories