bootstrap datepicker

by mukkaram waheed

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/css/bootstrap-datepicker.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/js/bootstrap-datepicker.min.js"></script>
<div class="well">
    <div class="input-append date" id="dp3" data-date="2012-01-02" data-date-format="yyyy-mm-dd">
        <input type="text" id="date-daily" /> <span class="add-on"><i class="icon-th"></i></span> 
    </div>
</div>
<textarea id="stdout" style="width:100%;height:10em;"></textarea>

CSS

#target {
    margin: 2em;
}

JavaScript

$(document).ready(function () {
   /*  $('#dp3').datepicker().on('changeDate', function (ev) {
        $('#date-daily').change();
    });
    $('#date-daily').val('0000-00-00');
    $('#date-daily').change(function () {
        $('#stdout').append($('#date-daily').val() + '\n');
        console.log($('#date-daily').val());
    }); */
    $('#date-daily').datepicker().on('changeDate', function(e) {
    $('#other-input').val(e.format(0,"dd/mm/yyyy"));
    /* alert(e.date) */;
    alert(e.format(0,"dd/mm/yyyy"));
    /* console.log(e.date) */;  
});
    $("#date-daily").datetimepicker({
     minDate:"2018/09/16",
    maxDate:"2018/09/18",
    viewMode: 'days',
    format: 'DD MMMM YYYY',
    dayViewHeaderFormat: 'MMMM YYYY',
});
});