Datepicker установить дату по умолчанию

Я пытаюсь установить дату по умолчанию для jQuery datepicker на init. Вот мой html:

var content = "";
            content = "<table class="filter-table">";
            content += "<tr><td><label for='startDate'>From </label></td><td><input name='startDate' id='startDate' class='date-picker' /></td></tr>";
            content += "<tr><td>&nbsp;</td></tr>";  
            content += "<tr><td><label for='endDate'>To </label></td><td><input name='endDate' id='endDate' class='date-picker'  /></td></tr>";

и мой JavaScript-код:

<script type="text/javascript">
    function showdatepicker() {
        $('.date-picker').datepicker( {
            changeMonth: true,
            changeYear: true,
            changeDay: true,
            showButtonPanel: true,
            dateFormat: 'yy-mm-dd',
            onClose: function(dateText, inst) { 
                var day = $("#ui-datepicker-div .ui-datepicker-day :selected").val();
                var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
                var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
                    $('#startDate').datepicker({defaultDate: -30});
                $('#endDate').datepicker({defaultDate: new Date()});
            }
        });
    }       
    </script>

то, что я пытаюсь сделать, это установить дату и показать в текстовом поле при загрузке страницы. Дата окончания должна быть текущей датой, а дата начала-месяцем ранее. Однако, используя эти коды, он не отображает дату в текстовом поле при первой загрузке.

интересно, почему это так. Спасибо заранее.

9
datepicker javascript jquery

2 ответов

Я, как и вы, не мог использовать метод datepicker для заполнения даты по умолчанию во входных данных.

поэтому вместо этого я сделал код с помощью vanilla JS для вычисления дат по умолчанию и форматирования их для отображения в текстовых полях.

вот JS, который я добавил:

function showdatepicker() {
    // same as yours
}

function populateDefaultValues() {
    var today = new Date();
    var month = today.getMonth() - 1,
        year = today.getFullYear();
    if (month < 0) {
        month = 11;
        year -= 1;
    }
    var oneMonthAgo = new Date(year, month, today.getDate());

    $('#startDate').val($.datepicker.formatDate('yy-mm-dd', today));
    $('#endDate').val($.datepicker.formatDate('yy-mm-dd', oneMonthAgo));
}

$(function() {
    populateDefaultValues();
    showdatepicker();
});

jsFiddle

6

посмотреть . Он предоставляет именно те функции, которые вам нужны.

поскольку параметры даты по умолчанию будут отличаться для каждого datepicker, вам нужно будет инициализировать их отдельно (в основном копировать-вставить и настроить в соответствии).

http://api.jqueryui.com/datepicker/#option-defaultDate

0