Yii2 grid filtering with dateRangePicker will not apply when input changes

Question

I applied datePeriodPicker to the input in the gridview Yii2 filter string. It works, but does not apply immediately after inserting the value. You need to click enter again and press Enter. Other fields work fine. Is there a way to make it apply like other inputs right after the change?

This uses script i:

var dateInput = $("[name='RequestSearch[request_date]']" ), configObject = { autoClose: true, language:'ru', separator: '/', showShortcuts : true, shortcuts: { 'next-days': [3,5,7], 'next': ['week','month','year'] }, startOfWeek: 'monday', }; dateInput.dateRangePicker(configObject); 

EDIT 1

Here is RequestSearch.php. dateRangePicker inserts values ​​like "2015-01-05 / 2015-05-09", so I had to make a handler that divides the value into $ start_date and $ end_date.

  public function rules() { return [ [['id', 'KP_id', 'minimal_payment', 'mover_company_id', 'manager_id', 'workers_number', 'workhours', 'payment_additional', 'payment_car', 'payment_sum'], 'integer'], [['request_date', 'payment_type', 'request', 'request_time', 'quantity', 'request_type', 'address', 'status', 'customer_id', 'comment',], 'safe'], ]; } $query->andFilterWhere([ 'id' => $this->id, ... ]); if ( ! is_null($this->request_date) && strpos($this->request_date, '/') !== false ) { list($start_date, $end_date) = explode('/', $this->request_date); $query->andFilterWhere(['between', 'request_date', $start_date, $end_date]); $this->request_date = null; } else { $query->andFilterWhere(['request_date' => $this->request_date,]); } 

Answer 1

It looks like the datepicker plugin that I used inserted an input value using val () or something like that that does not raise the "change" event, which is necessary for the mesh to filter correctly. Added .trigger ('change') parameter for input, and now everything works fine. With the plugin, I use a script here that works:

 var dateInput = $("[name='RequestSearch[request_date]']"); dateInput.dateRangePicker(); dateInput.bind('datepicker-closed', function(){ dateInput.trigger('change'); })