Selector de mes django jquery: la fecha "hasta" no siempre se actualiza como más tarde que "desde" fecha

Seguí el ejemplo en esta publicación:jquery datetime picker set minDate dynamic.

Intenté 2 maneras:

Primer metodo

este método solo funciona por PRIMERA VEZ seleccionando la fecha "hasta". Es decir, después de seleccionar una vez la fecha "desde" y "hasta", vuelvo a volver a seleccionar la lista desplegable "desde" fecha, luego "hasta" fecha no cambia en consecuencia, permanece como la primera vez que eligió:

$('.to').datepicker({
   beforeShow: function(input, inst) {
       var mindate = $('.from').datepicker('getDate');
       $(this).datepicker('option', 'minDate', mindate);
   }
});

html: para seleccionar del calendario de fechas "desde"

     <script type="text/javascript">
        $(function() {
     $('.from').datepicker(
                    {
                        dateFormat: "yy/mm",
                        changeMonth: true,
                        changeYear: true,
                        showButtonPanel: true,                                  
                        onClose: function(dateText, inst) {
                            function isDonePressed(){
                                return ($('#ui-datepicker-div').html().indexOf('ui-datepicker-close ui-state-default ui-priority-primary ui-corner-all ui-state-hover') > -1);
                            }

                            if (isDonePressed()){
                                var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
                                var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
                                $(this).datepicker('setDate', new Date(year, month, 1)).trigger('change');

                                 $('.date-picker').focusout()//Added to remove focus from datepicker input box on selecting date
                            }
                        },

                        beforeShow : function(input, inst) {

                            inst.dpDiv.addClass('month_year_datepicker')

                            if ((datestr = $(this).val()).length > 0) {
                                year = datestr.substring(datestr.length-4, datestr.length);
                                month = datestr.substring(0, 2);
                                $(this).datepicker('option', 'defaultDate', new Date(year, month-1, 1));
                                $(this).datepicker('setDate', new Date(year, month-1, 1));
                                $(".ui-datepicker-calendar").hide();
                            }
                        }
                    })
        });                 
        </script>

Puse en elhttps://jsfiddle.net/3w3h097c/ . En el violín, el calendario desplegable no aparece No sé por qué, pero sí aparece en mi navegador.

para seleccionar el calendario de fechas "hasta"

La única diferencia en comparación con el calendario de fechas "desde" es agregar las siguientes 2 oraciones:

beforeShow : function(input, inst) {
    var mindate = $('.from').datepicker('getDate'); // Added sentence, the rest same
    $(this).datepicker('option', 'minDate', mindate);  //>Added sentence,the rest same

    inst.dpDiv.addClass('month_year_datepicker')                            
    if ((datestr = $(this).val()).length > 0) {
        year = datestr.substring(datestr.length-4, datestr.length);
        month = datestr.substring(0, 2);
        $(this).datepicker('option', 'defaultDate', new Date(year, month-1, 1));
        ......     

Segundo método: no funciona en absoluto

Agregue una "onSelect: función (seleccionada)” para "desde" y "hasta".

<---from--->
$(function() {
     $('.from').datepicker(
                    {
                        dateFormat: "yy/mm",
                        changeMonth: true,
                        changeYear: true,
                        showButtonPanel: true,

                      <!--add onSelect here---->
                        onSelect: function(selected) {
                              $(".to").datepicker("option","minDate", selected)
                        },  
                        onClose: function(dateText, inst) {
                            function isDonePressed(){
                                return ($('#ui-datepicker-div').html().indexOf('ui-datepicker-close ui-state-default ui-priority-primary ui-corner-all ui-state-hover') > -1);
                            }

                            if (isDonePressed()){
                                var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
                                var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
                                $(this).datepicker('setDate', new Date(year, month, 1)).trigger('change');

                                 $('.from').focusout()//Added to remove focus from datepicker input box on selecting date
                            }
                        },

                        beforeShow : function(input, inst) {

                            inst.dpDiv.addClass('month_year_datepicker')

                            if ((datestr = $(this).val()).length > 0) {
                                year = datestr.substring(datestr.length-4, datestr.length);
                                month = datestr.substring(0, 2);
                                $(this).datepicker('option', 'defaultDate', new Date(year, month-1, 1));
                                $(this).datepicker('setDate', new Date(year, month-1, 1));
                                $(".ui-datepicker-calendar").hide();
                            }
                        }
                    })
        });

<!--to:-->

$(function() {
    $('.to').datepicker(
........
onSelect: function(selected) {
                           $('.from').datepicker("option","maxDate", selected)
                        },

.......

Respuestas a la pregunta(1)

Su respuesta a la pregunta