Vue JS - Bootstrap Datepicker
HTML
<div class="m-form__group m-form__group">
<label class="m-label m-label--single">From Date:</label>
<div class="input-group date">
<input type="text" class="form-control datepicker " v-model="form.from_date" id="from_date" />
<div class="input-group-append">
<span class="input-group-text">
<i class="la la-calendar-check-o"></i>
</span>
</div>
</div>
</div>
JS
mounted(){
var _this = this;
$(document).on("focus", ".datepicker", function () {
$(this).datepicker({
format: 'dd/mm/yyyy',
todayHighlight: true,
clearBtn: true,
}).on('changeDate', function (ev) {
$(this).datepicker('hide');
var dateField = $(this).attr('id');
if (ev.date == undefined) {
if (dateField == 'from_date') {
_this.form.from_date = '';
}
} else {
if (dateField == 'from_date') {
_this.form.from_date = moment(ev.date).format('YYYY-MM-DD');
}
}
});
});
},
No comments:
Post a Comment