Using marionette and trying to display a jquery date picker. However, when I click on the input, the calendar does not appear.
This is my view:
const view = app.Views.Layout.extend({
template: require('./templates/template'),
ui: {
dateInput: '#date_input',
},
onShow() {
this.ui.dateInput.datepicker();
},
My template with the datepicker div:
<div id="date_container" class="input_holder">
<input type="text" id="date_input" placeholder="mm/dd/year"></input>
<div id="date_picker_holder"></div>
</div>
I would assume this would be enough for the calendar to render properly however it doesnt happen. Am I missing something in my view or my template?
this.ui.dateInput
is a selector. You need to create a jQuery object by passing this selector to it and then call .datepicker() on the result:
$(this.ui.dateInput).datepicker();