linked datepicker with Jquery

Navigation
0

I have a form with a date period ('Start date' and 'End date'). The start date can not be less than the end date and the end date can not be less than the start date. These inputs are using the datequicker of the JQuery UI (JQueryUI 1.11.0 and JQuery 3.1.1).

I looked in the Jquery UI documentation and found the example below: 

$(function () {
    var dateFormat = "dd/mm/yy",
        from = $("#from")
        .datepicker()
        .on("change", function () {
            to.datepicker("option", "minDate", getDate(this));
        }),
        to = $("#to").datepicker()
        .on("change", function () {
            from.datepicker("option", "maxDate", getDate(this));
        });

    function getDate(element) {
        var date;
        try {
            date = $.datepicker.parseDate(dateFormat, element.value);
        } catch (error) {
            date = null;
        }

        return date;
    }
});

Is there any other way to do this?

    
asked by anonymous 03.09.2018 / 20:27

1 answer

1

There are many other ways to do this, for example:

using html and jQuery 

$( document ).ready(function() {
  $("#dtaInicio, #dtaFinal").change(function(){
   var inicio = document.getElementById("dtaInicio").value;    var fim = document.getElementById("dtaFinal").value;
    console.log(inicio);
    console.log(fim);
   if (new Date(inicio) > new Date(fim)) {
     alert("inicio maior que fim return false");  
     return false;
   }
  
   
  });
  
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><html><label>DataInicial:<inputid="dtaInicio" type="date" value="" size=10 />
</label>
<label>
Data Final:
<input id="dtaFinal" type="date" value="" size=10 />
</label>

</html>

Try to put a start date bigger than the final, it will return false, in the example I put this check in the changes of the inputs, you can put to submit of a form

    
03.09.2018 / 21:12
Why does not this work? Code does not update in JPA hibernate in Eclipse