Hermes
Hermes

Reputation: 462

Bootstrap datepicker autoclose doesnt work

I'm using Bootstrap datepicker. When the date is selected, datepicker doesn't close automatically. I'm using this library.

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="asset/datepicker/css/bootstrap-datepicker.css">
<link rel="stylesheet" href="asset/datepicker/css/bootstrap-datepicker.standalone.css">
<script src="https://ajax.googleapis.com/ajax/libs/jQuery/1.10.2/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

My code is here:

    $.fn.datepicker.defaults.format = "dd-mm-yyyy";
    $('#date2').datepicker({autoclose: true});

        $('#date2').datepicker({autoclose: true})
        .on("input change", function (e) {
        $("#last_date").val(e.target.value);
        var from = e.target.value.split("-");
        var f = new Date(from[2], from[1] - 1, from[0]);
        var today = new Date();
        var x="31-12-2014";
         x = x.split('-');
         var new_date=new Date(x[2], x[1] - 1, x[0]);
        today.setHours(0,0,0,0);        
        if (f > today || new_date>f) {
                $("#date2").datepicker('hide');
                alert("Choose a valid date");
                //$("#date2").datepicker('update', "14-06-2016");
                $("#date2").val("");
                $("#date2").focus();
            }           
    });

Upvotes: 2

Views: 7253

Answers (1)

VijayGupta
VijayGupta

Reputation: 675

This is worked, check it!

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

<link rel="stylesheet" href="/resources/demos/style.css">
<script>
  $(function() {
    $("#datepicker").datepicker({autoclose: true});
  });
</script>
</head>
<body>

<p>Date: <input type="text" id="datepicker"></p>

Upvotes: 2

Related Questions