Bootstrap datepicker — How to get toDisplay in other format and toValue in other format too

Question

For a long time, I'm having trouble with toValue and toDisplay. I need and appear on the display to show the date in format dd.mm.yyyy and u toValue, which is sent with the form so that it is in the yyyy-mm-dd format. I tried all kinds of things but it still does not work. I attach the code from the plugin's official page.

toDisplay: function (date, format, language) {
        var d = new Date(date);
        d.setDate(d.getDate() - 7);
        return d.toISOString();
},
toValue: function (date, format, language) {
        var d = new Date(date);
        d.setDate(d.getDate() + 7);
        return new Date(d);
}

Thank you in advance for your help!

Answer 1

I had exactly the same problem and struggled long to find a viable solution for this...

In the end I had to give up on trying to getting the format right with that function, I simply used another hidden inputfield to store the dateformat to submit, which is updated on calendar change. I used moment.js to

markup

 <input placeholder="dd.mm.yyyy" class="form-control datepicker" id="birthday" name="person[birthday]" value="01.01.1970" type="text"> 
 <input id="birthday-val" name="person[birthday]" value="1970-01-01" type="hidden"> 

<script>
$('.datepicker').datepicker({
    autoclose: true,
    locale:  'de',
    format:  'dd.mm.yyyy'
});
$('.datepicker').on('changeDate', function(e){
    //console.log( moment(e.date).format('YYYY-MM-DD') );
    $(this).next('input[type=hidden]').val( moment(e.date).format('YYYY-MM-DD') );
});
</script>

Hope that helps.

Answer 2

 $("#elementID").datepicker({
        format: "dd/mm/yyyy", // or what ever format your want
        calendarWeeks: true,
        todayHighlight: true,
        clearBtn: true,
        autoclose: true
    });

Include moment.js library in your page then

var date = moment($('#elementID').datepicker("getDate")).format("YYYY/MM/DD");