Vue Dropdown Datepicker

            import DropdownDatepicker from '../src/dropdown-datepicker.vue';
            new Vue({
                el: '#app',
                components: {
                    DropdownDatepicker
                },
                data:{},
                methods: {
                    //your method codes here
                }
            });
    

Plugin Defaults

<dropdown-datepicker></dropdown-datepicker>

Date Range

TO:

<dropdown-datepicker submit-id="from" v-bind:on-change="onChange" v-bind:min-date="minDate"></dropdown-datepicker>

<dropdown-datepicker submit-id="to" ref="to"></dropdown-datepicker>

        data:{
            .....
            minDate: null,
            maxDate: null
        },
        methods: {
            ..........
            onChange(day, month, year){
                var days = 100;
                if(day != '' && month != '' && year != ''){
                    this.minDate = year+'-'+month+'-'+day;
                    this.minDate = new Date(this.minDate);
                    this.minDate.setDate(this.minDate.getDate());
                    this.minDate = this.minDate.getFullYear()+'-'+(this.minDate.getMonth()+1)+'-'+this.minDate.getDate();
                    this.maxDate = new Date(this.minDate);
                    this.maxDate.setDate(this.maxDate.getDate()+days);
                    this.maxDate = this.maxDate.getFullYear()+'-'+(this.maxDate.getMonth()+1)+'-'+this.maxDate.getDate();
                    this.$refs.to.minDateValue = this.minDate;
                    this.$refs.to.maxDateValue = this.maxDate;
                    this.$refs.to.init();
                }
            }
        }

Submit Format

<dropdown-datepicker submit-id="example2" submit-format="dd/mm/yyyy"></dropdown-datepicker>

Default Date

<dropdown-datepicker submit-id="example3" default-date="2010-02-17"></dropdown-datepicker>

Min. Age 18 (Year)

<dropdown-datepicker submit-id="example4" v-bind:min-age="18"></dropdown-datepicker>

Alternative Display Format

<dropdown-datepicker submit-id="example5" display-format="mdy"></dropdown-datepicker>

Short Month Names

<dropdown-datepicker submit-id="example6" month-format="short"></dropdown-datepicker>

Unix

<dropdown-datepicker submit-id="example7" submit-format="unix" default-date-format="unix"></dropdown-datepicker>

Unix Default Date

<dropdown-datepicker submit-id="example8" submit-format="unix" default-date-format="unix" default-date="2148844553"></dropdown-datepicker>

Unix Input Default Date

<dropdown-datepicker submit-id="example9" submit-format="unix" default-date-format="unix" ></dropdown-datepicker>

Required

<dropdown-datepicker submit-id="example10" v-bind:required="true"></dropdown-datepicker>

Alternative Select Labels

<dropdown-datepicker submit-id="example11" year-label="Anno" month-label="Mense" day-label="Die"></dropdown-datepicker>

v-model support

{{ exampleModel }}

<dropdown-datepicker v-model="exampleModel"></dropdown-datepicker>