Monthpicker instantiation - Collaborating monthpickers

// This monthpicker requires my monthpicker.js and monthpicker.css available here: https://pastebin.com/u/Ultroman
// If you want to see the instructions, go to this StackOverflow post: https://stackoverflow.com/a/26011321/1289974
        // The value retrieved from this monthpicker, is always the FIRST day of the selected month. Starts at the current month.
        $('#start').monthpicker({
            dateFormat: 'MM yy',
            changeMonth: true,
            changeYear: true,
            showMonthAfterYear: true,
            showAnim: "drop",
            constrainInput: true,
            yearRange: "-100Y:+10Y",
            minDate: new Date(new Date().getFullYear() - 100, new Date().getMonth(), 1),
            maxDate: new Date((new Date().getFullYear() + 10), new Date().getMonth(), 1),
            defaultDate: new Date(new Date().getFullYear(), new Date().getMonth(), 1),

            // Datepicker functions
            onClose: function (dateText, inst) {
                var date = new Date(inst.selectedYear, inst.selectedMonth, 1);
                $(this).monthpicker('option', 'defaultDate', date);
                $(this).monthpicker('setDate', date);


                /*
                 * This last bit of 'onClose' is only for when you want to update the properties of another monthpicker, to match the date
                 * being set on this monthpicker. This is for when you want to use two monthpickers to define a timeperiod, and #end should
                 * never have a date set to before #start's date.
                 */
                var newMinDate = new Date(inst.selectedYear, inst.selectedMonth + 1, 0);
                // If the end-date monthpicker hasn't been opened yet, then 'getDate' will return null in here, even if you've initialized it using 'setDate'
                // later on in document.ready.
                // Therefore, we need to initialize its date with its default value here, if its date is null. Otherwise we will see weird behavior.
                // NOTE: 'getDate' will NOT return null, if you call it from an outside function, after you've initialized it using 'setDate'.
                // It is only a problem inside internal monthpicker functions. That's some weirdness for you right there!
                if ($('#end').monthpicker('getDate') == null) {
                    // If the date is null, we set #end to its defaultDate.
                    $('#end').monthpicker('setDate', $('#end').monthpicker('option', 'defaultDate'));
                }

                // Then we set #end's minDate to be the date we just selected in this monthpicker.
                // NOTE: If you remove just this line, then the #end monthpicker won't be restricted, by having its minDate set.
                // The code after this line will still help the user, by changing the selected and default dates in #end, to one that is
                // compatible with 'newMinDate', if it is currently set to be before 'newMinDate'.
                // If you want a less restrictive, yet STILL error-protected design, feel free to remove this line.
                $('#end').monthpicker('option', 'minDate', newMinDate);

                // If #end's selected date is before the new minDate, we set its defaultDate and current date to the new minDate. Otherwise, we leave it be.
                if($('#end').monthpicker('option', 'defaultDate') < newMinDate) {
                    $('#end').monthpicker('option', 'defaultDate', newMinDate);
                    $('#end').monthpicker('setDate', newMinDate);
                }
            },

            beforeShow: function (input, inst) {
                if ($(this).monthpicker("getDate") !== null) {
                    // Making sure that the date set is the first of the month.
                    if($(this).monthpicker("getDate").getDate() !== 1){
                        var date = new Date(inst.selectedYear, inst.selectedMonth, 1);
                        $(this).monthpicker('option', 'defaultDate', date);
                        $(this).monthpicker('setDate', date);
                    }
                } else {
                    // If the date is null, we reset it to the defaultDate. Make sure that the defaultDate is always set to the first of the month!
                    $(this).monthpicker('setDate', $(this).monthpicker('option', 'defaultDate'));
                }


                /*
                 * This last bit of beforeShow is only for when you want to help the user, by defaulting to a date that is compatible with the
                 * date already selected in an end-monthpicker. Meaning, if you select a date in the end-monthpicker first, and then open this one,
                 * you want this one to default to a date before the end-monthpicker's date.
                 */
                var endDate = $('#end').monthpicker('getDate');
                if (endDate !== null && endDate !== undefined) {
                    var compatibleStartDate = new Date(endDate.getFullYear(), endDate.getMonth(), 1);
                    var thisDate = $(this).monthpicker("getDate");
                    if (thisDate !== null) {
                        if (thisDate > compatibleStartDate) {
                            $(this).monthpicker('option', 'defaultDate', compatibleStartDate);
                            $(this).monthpicker('setDate', compatibleStartDate);
                        }
                    } else {
                        $(this).monthpicker('option', 'defaultDate', compatibleStartDate);
                        $(this).monthpicker('setDate', compatibleStartDate);
                    }
                }
            },
            // Special monthpicker function!
            onChangeMonthYear: function(year, month, inst) {
                $(this).val($.monthpicker.formatDate($(this).monthpicker('option', 'dateFormat'), new Date(year, month - 1, 1)));
            }
        });

        // The value retrieved from this monthpicker, is always the LAST day of the selected month.
    // Starts at the current month + 2, to get the current month and the next two months (a quarter).
        $('#end').monthpicker({
            dateFormat: 'MM yy',
            changeMonth: true,
            changeYear: true,
            showMonthAfterYear: true,
            showAnim: "drop",
            constrainInput: true,
            yearRange: "-100Y:+10Y",
            minDate: new Date(new Date().getFullYear() - 100, new Date().getMonth() + 1, 0),
            maxDate: new Date((new Date().getFullYear() + 10), new Date().getMonth() + 1, 0),
            defaultDate: new Date(new Date().getFullYear(), new Date().getMonth() + 3, 0),

            onClose: function (dateText, inst) {
                var date = new Date(inst.selectedYear, inst.selectedMonth + 1, 0);
                $(this).monthpicker('option', 'defaultDate', date);
                $(this).monthpicker('setDate', date);




                var newMaxDate = new Date(inst.selectedYear, inst.selectedMonth, 1);
                if ($('#start').monthpicker('getDate') == null) {
                    // If the date is null, we set #start to its defaultDate.
                    $('#start').monthpicker('setDate', $('#start').monthpicker('option', 'defaultDate'));
                }

                if($('#start').monthpicker('getDate') > newMaxDate) {
                    $('#start').monthpicker('option', 'defaultDate', newMaxDate);
                    $('#start').monthpicker('setDate', newMaxDate);
                }
            },

            beforeShow: function (input, inst) {
                if ($(this).monthpicker("getDate") !== null) {
                    // Making sure that the date set is the last of the month.
                    var date = new Date(inst.selectedYear, inst.selectedMonth + 1, 0);
                    if($(this).monthpicker("getDate").getDate() !== date){
                        $(this).monthpicker('option', 'defaultDate', date);
                        $(this).monthpicker('setDate', date);
                    }
                } else {
                    // If the date is null, we reset it to the defaultDate. Make sure that the defaultDate is always set to the last of the month!
                    $(this).monthpicker('setDate', $(this).monthpicker('option', 'defaultDate'));
                }


                /*
                 * This last bit of beforeShow is only for when you want to help the user, by defaulting to a date that is compatible with the
                 * date already selected in a start-monthpicker.
                 * Meaning, if the default date in the start-monthpicker is after the date in this end-monthpicker, and you open this one first,
                 * you want the start-monthpicker to default to a date before the end-monthpicker's date. It's mostly a fail-safe.
                 */
                if ($('#start').monthpicker('getDate') == null) {
                    // If the date is null, we set #start to its defaultDate.
                    $('#start').monthpicker('setDate', $('#start').monthpicker('option', 'defaultDate'));
                }

                var startDate = $('#start').monthpicker('getDate');

                if (startDate !== null && startDate !== undefined) {
                    var compatibleEndDate = new Date(startDate.getFullYear(), startDate.getMonth() + 1, 0);
                    var thisDate = $(this).monthpicker("getDate");
                    if (thisDate !== null) {
                        if (thisDate < compatibleEndDate) {
                            $(this).monthpicker('option', 'defaultDate', compatibleEndDate);
                            $(this).monthpicker('setDate', compatibleEndDate);
                        }
                    } else {
                        $(this).monthpicker('option', 'defaultDate', compatibleEndDate);
                        $(this).monthpicker('setDate', compatibleEndDate);
                    }
                }
            },

            onChangeMonthYear: function (year, month, inst) {
                $(this).val($.monthpicker.formatDate($(this).monthpicker('option', 'dateFormat'), new Date(year, month, 0)));
            }
        });