DatePicker Bootstrap lost date range after postback

Question

my application is an ASP.NET MVC and I implemented bootstrap datepicker, like below:

$(window).load(function () {

        var startDate = new Date('01/01/2012');
        var FromEndDate = new Date();
        var ToEndDate = new Date();

$('#DataInicio').datepicker({
            format: "dd/mm/yyyy",
            todayBtn: "linked",
            startDate: '01/01/2012',
            language: "pt-BR",
            todayHighlight: true,
            endDate: FromEndDate,
            autoclose: true
        }).on('changeDate', function (selected) {
            startDate = new Date(selected.date.valueOf());
            startDate.setDate(startDate.getDate(new Date(selected.date.valueOf())));
            $('#DataFim').datepicker('setStartDate', startDate);
        });

$('#DataFim').datepicker({
            format: "dd/mm/yyyy",
            todayBtn: "linked",
            language: "pt-BR",
            todayHighlight: true,
            startDate: startDate,
            endDate: ToEndDate,
            autoclose: true
        }).on('changeDate', function (selected) {
            FromEndDate = new Date(selected.date.valueOf());
            FromEndDate.setDate(FromEndDate.getDate(new Date(selected.date.valueOf())));
            $('#DataInicio').datepicker('setEndDate', FromEndDate);
        });

At the first time pageload, the daterange works perfectly, but after postpack the daterange lost the configuration, the images below is first time and after postback:

enter image description here

The configuration to prevent choice a date start greater than end date is lost.

How can I fixed after postback and keeping the range selected?

Thanks

Is this a postback or is it been updated by ajax as window.load won't fire if it's updated with ajax you would need to update the element when the ajax call finishes. — Dreamwalker

Bruno Arruda Bruno Arruda · Accepted Answer · 2014-02-13T12:21:37

I fixed using this solution:

if ($('#DataInicio').val()) {
    startDate = $('#DataInicio').val();
   };

if ($('#DataFim').val()) {
    FromEndDate = $('#DataFim').val();
   };

After postback the date range is maintained.

DatePicker Bootstrap lost date range after postback

1 Answers