jQuery datepicker устанавливает выбранную дату на лету

Как я могу динамически изменить выбранную дату средства выбора даты jquery на лету? Я сказал, что создал встроенное средство выбора даты. Затем, через некоторое время, я хочу отразить там другую дату, не воссоздавая указатель даты с нуля.

Я пробовал использовать метод setDate, но это не сработало, а в документации не так много документации.

Есть еще один (расширенный?) Плагин здесь, но я хочу использовать плагин, который поставляется с jquery.ui.all.js.


person Sabya    schedule 03.03.2009    source источник


Ответы (14)


Какую версию jQuery-UI вы используете? Я тестировал следующее с 1.6r6, 1.7 и 1.7.1, и он работает:

//Set DatePicker to October 3, 2008
$('#dateselector').datepicker("setDate", new Date(2008,9,03) );
person Ben Koehler    schedule 15.04.2009
comment
используйте defaultDate вместо setDate, если setDate не работает. - person bingjie2680; 11.04.2012
comment
но для меня это не сработало. дата была изменена. но выбранная дата не отображается в календаре. он показывает мне только сегодня выделенный. - person Prageeth godage; 30.10.2013
comment
Это не работает для версии 3.1+. Используйте $ ('# picker'). Data ('daterangepicker'). SetStartDate ('03 / 03/2021 ') - person Manpreet Singh Dhillon; 20.04.2021

Убедитесь, что дата, которую вы пытаетесь установить, находится в допустимом диапазоне дат, если установлены параметры minDate или maxDate.

person cfwall    schedule 22.09.2010

В этом примере показано, как использовать значение по умолчанию в раскрывающемся календаре и значение в текстовом поле. Он также показывает, как установить значение по умолчанию на предыдущую дату.

selectedDate - еще одна переменная, которая содержит текущую выбранную дату календаря.

    var date = new Date();
    date.setDate(date.getDate() - 1);

    $("#datepicker").datepicker({
        dateFormat: "yy-mm-dd",
        defaultDate: date,
        onSelect: function () {
            selectedDate = $.datepicker.formatDate("yy-mm-dd", $(this).datepicker('getDate'));
        }
    });

    $("#datepicker").datepicker("setDate", date);
person Vlad Bezden    schedule 30.05.2014

Отметил, что для DatePicker Кейт Вуд (http://keith-wood.name/datepickRef.html ) следующие работы - обратите внимание, что установка даты по умолчанию последняя:

    $('#datepicker').datepick({
        minDate: 0,
        maxDate: '+145D',
        multiSelect: 7,
        renderer: $.datepick.themeRollerRenderer,
        ***defaultDate: new Date('1 January 2008')***
    });
person Michael    schedule 18.08.2010

По какой-то причине в некоторых случаях мне не удавалось заставить setDate работать.

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

var date = new Date(2008,9,3);
$("#your-input").val(date.getMonth()+"/"+date.getDate()+"/"+date.getFullYear());
// Will display 9/3/2008 in your #your-input input
person Guillaume Flandre    schedule 30.05.2009
comment
Есть отключение на один месяц, поэтому вам нужно (date.getMonth () + 1) - person Adam; 02.08.2012
comment
setDate не работает, если он установлен в начальных параметрах, потом я связал его с .datepicker ('setDate', ...) - person martinedwards; 06.07.2015

$('.date-pick').datePicker().val(new Date()).trigger('change')

наконец то, что я ищу последние несколько часов! Мне нужно инициировать изменения, а не просто установить дату в текстовом поле!

person Oleksii Semeniuk    schedule 24.08.2018
comment
Это должно быть .datepicker(), а не .datePicker() - person Arslan Tabassum; 04.09.2019

Это работает для меня:

$("#dateselector").datepicker("option", "defaultDate", new Date(2008,9,3));
person Gjermund Dahl    schedule 16.04.2015

Это старая ветка, но я просто хочу дать некоторую информацию о том, как я ее использовал. Если вы хотите установить сегодняшнюю дату, вы можете просто применить ее, как показано ниже.

 $("#datepickerid").datepicker("setDate", "0");

Если вы хотите установить несколько дней до / после текущей даты, используйте символ -/+, указывающий, сколько дней вы хотите, как показано ниже.

 $("#datepickerid").datepicker("setDate", "-7");
 $("#datepickerid").datepicker("setDate", "+5");
person Suresh Ponnukalai    schedule 18.12.2017

setDate кажется проблемой только со встроенным datepicker, используемым в пользовательском интерфейсе jquery, конкретная ошибка - InternalError: слишком много рекурсии.

person Allen    schedule 26.08.2011

В Html вы можете добавить поле ввода с помощью средства выбора даты, подобного этому

<input class="form-control date-picker fromDates" id="myDate" type="text">

а затем в java-скрипте инициализируйте свой datepicker и установите для своего значения дату, подобную этой,

$('.fromDates').datepicker({
                maxDate: '0',
                dateFormat: "dd/mm/yy",
                changeYear: true,
                changeMonth: true,
                yearRange: "-100:+0"
            });

var myDateVal = moment('${value}').format('DD/MM/YYYY');
$('#myDate').datepicker().datepicker('setDate', myDateVal );

(Здесь атрибут fromdate показывает предыдущие даты текущей даты)

person chamzz.dot    schedule 29.01.2019

пожалуйста, найдите ниже один, это очень помогает мне установить функцию данных

$ ('# datepicker'). datepicker ({dateFormat: 'yy-mm-dd'}). datepicker ('setDate', '2010-07-25');

person Shyam    schedule 23.01.2021

У меня тоже было много проблем с методом setDate. похоже, работает только в v1. Однако, похоже, что работает метод dpSetSelected:

    $("#dateselector").dpSetSelected(new Date(2010, 0, 26).asString());

удачи!

person tijs    schedule 10.04.2009

или вы можете просто иметь

$('.date-pick').datePicker().val(new Date()).trigger('change')
person Gayan    schedule 19.03.2015
comment
Это должно быть .datepicker(), а не .datePicker(). - person Florin Frătică; 18.10.2017

person    schedule
comment
Ответы только на код не приветствуются в Stack Overflow, потому что они не объясняют, как это решает проблему. Пожалуйста, отредактируйте свой ответ, чтобы объяснить, что делает код и как он отвечает на вопрос, чтобы он был полезен и другим пользователям, а также OP. - person FluffyKitten; 31.07.2020