How to trigger on change/select event in DatePicker Widget

Yii 2.0 General Discussions
1

I am using yii2 DatePicker Widget. It is working correctly. But I want to trigger onchange or onselect event on change of date. I am using following code but onchange event doesnot trigger.




<?php echo \yii\jui\DatePicker::widget([

                                'inline'=>true,

                                'clientOptions'=>[

                                    'minDate'=>'0',

                                ],

                                'clientEvents' => [

                                    'change' => 'function () { alert(\'event "change" occured.\'); }',

                                ],

                            ]);?>

Please correct me where I am making mistake.

Thank you

2

Are you sure that you have not other javascript errors in the page? Debug it with browser.

Because the code seems good.

3

Yes I am sure, No javascript error. I can see even javascript code like below in script tag


jQuery(document).ready(function () {

jQuery('#w0-container').datepicker({"minDate":"0","defaultDate":null,"altField":"#w0","dateFormat":"M d, yy"});

jQuery('#w0-container').on('datepickerchange', function () { alert('event "change" occured.'); });

But on change of date, no alert. I think something is missing but not getting what is that.

4

This line is wrong:


jQuery('#w0-container').on('datepickerchange', function () { alert('event "change" occured.'); });

it should be:


jQuery('#w0-container').on('change', function () { alert('event "change" occured.'); });
5

Yes It should be "change" in place of "datepickerchange". I have set "change" but it appends widget name. How can set exactly "Change"

6

Anybody have tried to solve. I have been stucked into it.

7

Looks like there are no events for Datepicker http://api.jqueryui.com/datepicker

But you can use onSelect option http://api.jqueryui.com/datepicker/#option-onSelect




'clientOptions' => [

    'onSelect' => new \yii\web\JsExpression('function(dateText, inst) { console.log(dateText, inst) }'),

],
8

Thanks again Bizley. You solved my issue. Thank you so much

9

Hi Bizley

I’m trying something like this




'onClose' => 'js:function(selectedDate){ 

          $("#fechafinal").datepicker("option", "minDate", selectedDate);

	}',

But in Yii2 no work, I’m use Datepicker Dosamigos.

Can you help?

10

There is ‘clientEvents’ parameter and then there is this ‘hide’ event. I have not seen ‘close’ event there so ‘hide’ should do the trick.