jQuery DatePicker - выбор целой недели - PullRequest
1 голос
/ 30 июля 2011

Я использую два средства выбора даты jQuery, чтобы выбрать диапазон дат. Есть ли способ выбрать целую неделю? Это означает, что при открытии стартового средства выбора даты будет два метода выбора:

  • Выберите одну дату начала (без влияния на конечный указатель даты).
  • Выберите целую неделю (в которой начальный указатель даты устанавливается на первый день недели, а затем конечный указатель даты на последний).

В календаре asp нечто подобное можно сделать, установив для свойства SelectionMode значение "DayWeek", но у меня нет способа добиться этого в jQuery datepicker. Можно ли это сделать?

Ответы [ 2 ]

3 голосов
/ 02 августа 2011

Вот как я реализовал это:

// A click on a week number cell in the weeks column of the start datepicker
$("td.ui-datepicker-week-col").live("click", function()
{
    // Simulate a click on the first day of the week
    $(this).next().click();

    // Grab the date, and set the end of the week in the end datepicker
    var fromDate = $("#inputStartDate").datepicker("getDate");    
    var toDate = fromDate;
    toDate.setDate(fromDate.getDate() + 6);
    $("#inputEndDate").datepicker("setDate", toDate);
});
1 голос
/ 27 ноября 2013

Вот пример, когда можно щелкнуть оба поля ввода:

    $(document).ready(function(){
        // date picker for Export part
        $(".datePicker").datepicker(
                {
                    dateFormat: 'yymmdd',
                    showWeek: true,
                    firstDay: 1,
                    weekHeader: "",
                    showOtherMonths: true,
                    selectOtherMonths: true
                }
        ).focus(function(){
            // prevent focus event firing twice
            var $this = $(this);
            var now = +new Date();
            var lastClicked = $this.data("lastClicked");
            if (lastClicked && (now - lastClicked) < 100) {
                // Don't do anything
                return;
            }
            $this.data("lastClicked", now);

            var el = this;

            // A click on a week number cell in the weeks column of the start datepicker
            $("td.ui-datepicker-week-col").click(function(){
                // Simulate a click on the first day of the week
                $(this).next().click();

                var selectedDate = $(el).datepicker("getDate");
                $("#inputStartDate").datepicker("setDate", selectedDate);
                var toDate = selectedDate;
                toDate.setDate(toDate.getDate() + 6);
                $("#inputEndDate").datepicker("setDate", toDate);
            });
        });
    });
...