I am using the following input from the ember-pikaday addon:
<div class="col-sm-3"><label>Date From:</label>{{pikaday-input value=dateFrom name="dateFrom" class="form-control"}}</div>
I cannot get the value of the input to update the query parameter in the URL. If I use a standard input it works with the following controller:
import Controller from '@ember/controller';
export default Controller.extend({
queryParams: ['dateFrom', 'dateTo', 'unitNumber'],
dateFrom: null,
dateTo: null,
unitNumber: null,
actions: {
selected(x){
module = x
},
submitQuery(dateFrom, dateTo, unitNumber){
switch(module) {
case 'Option 1':
this.transitionToRoute('option1', {queryParams: {dateFrom: this.get('dateFrom'), dateTo: this.get('dateTo'), unitNumber: this.get('unitNumber') }})
break;
}
}
}
});
I suspect I need an action when a date is selected but I do not know how to handle the update within the action. I tried the following:
//onSelection=(action 'select') added to pikday input
select() {
dateFrom = this.set('dateFrom')
}
But it did not represent in the URL. I think that would be incorrect scoping anyway. I am still very new to Ember (and coding). Any help would be very appreciated.
Here they mentioned how to use this package, https://github.com/edgycircle/ember-pikaday#usage
{{pikaday-input onSelection=(action 'doSomethingWithSelectedValue')}}
In your case, you need to update the selected value from pikaday input to dateFrom
property of the controller.
{{pikaday-input value=dateFrom name="dateFrom" class="form-control" onSelection=(action 'onChangeDateFrom') }}
define actions in the controller actions hash,
onChangeDateFrom(selectedValue)
{
this.set('dateFrom',selectedValue);
}