♥ § Клуб Одиноких Сердец :: Элемент Календарик (Datepicker) плагина UI библиотеки jQuery ♥

Описание: Выбор даты из календарика, который появляется в новом окне или из строки-календарика.
Description: Select a date from a popup or inline calendar.

Пример странички Календарик дефолтный (Default functionality):
можно посмотреть здесь.

Пример странички Календарик Форматы дат (Format date):
можно посмотреть здесь.

Пример странички Календарик с ограничениям по интервалу дат (Restrict date range):
можно посмотреть здесь.

Пример странички Календарик Локализованный (Localize calendar):
можно посмотреть здесь.

Пример странички Календарик с дополнительным показом даты в альтернативном виде (Populate alternate field):
можно посмотреть здесь.

Пример странички Календарик Линейный (Display inline):
можно посмотреть здесь.

Пример странички Календарик с кнопочной панелькой (Display button bar):
можно посмотреть здесь.

Пример странички Календарик с меню для годов и месяцев (Display month & year menus):
можно посмотреть здесь.

Пример странички Календарик с датами в других месяцах (Dates in other months):
можно посмотреть здесь.

Пример странички Календарик с показом недели текущего года (Show week of the year):
можно посмотреть здесь.

Пример странички Календарик с показом многих месяцев (Display multiple months):
можно посмотреть здесь.

Пример странички Календарик с иконкой триггера (Icon trigger):
можно посмотреть здесь.

Пример странички Календарик Анимационный (Animations):
можно посмотреть здесь.

Пример странички Календарик с интервалами дат (Date Range):
можно посмотреть здесь.

---

Теория

Тесты по теории можно посмотреть здесь.

---

Options (Опции)

---

altField
Type: Selector or jQuery or Element
Default: ""

An input element that is to be updated with the selected date from the datepicker. Use the altFormat option to change the format of the date within this field. Leave as blank for no alternate field.
Альтернативное поле - элемент инпута, который обновляется вместе с выбранной датой из Календарика. Используйте опцию altFormat (альтернативный формат), чтобы изменить формат даты в данном поле. Оставьте пустым, если нет потребности в альтернативном поле.

Code examples: (Примеры кода: )
Initialize the datepicker with the altField option specified:
Инициализация Календарика с определенной опцией altField:



Get or set the altField option, after initialization::
Можно получить или установить опцию altField после инициализации:

---

altFormat
Type: String
Default: ""

The dateFormat to be used for the altField option. This allows one date format to be shown to the user for selection purposes, while a different format is actually sent behind the scenes. For a full list of the possible formats see the [[UI/Datepicker/formatDate|formatDate]] function.
Формат даты (dateFormat), используемый для опции altField (альтернативное поле). Это позволяет использовать один формат даты для показа с целью выбора пользователем, в тоже время другой формат можно использовать для компьютерных расчетов. Полный лист возможных форматов см в описании функции [[UI/Datepicker/formatDate|formatDate]].

Code examples: (Примеры кода: )
Initialize the datepicker with the altFormat option specified:
Инициализация Календарика с определенной опцией altFormat:



Get or set the altFormat option, after initialization::
Можно получить или установить опцию altFormat после инициализации:

---

appendText
Type: String
Default: ""

The text to display after each date field, e.g., to show the required format.
Текст для показа после каждого поля даты, например, для показа требуемого формата даты.

Code examples: (Примеры кода: )
Initialize the datepicker with the appendText option specified:
Инициализация Календарика с определенной опцией appendText:



Get or set the appendText option, after initialization:
Можно получить или установить опцию appendText после инициализации:

---

autoSize
Type: Boolean
Default: false

Set to true to automatically resize the input field to accommodate dates in the current dateFormat.
Если установлено на значение true (истина), то автоматически производится изменение размера поля ввода, чтобы адаптировать дату для текущего формата.

Code examples: (Примеры кода: )
Initialize the datepicker with the autoSize option specified:
Инициализация Календарика с определенной опцией autoSize:



Get or set the autoSize option, after initialization:
Можно получить или установить опцию autoSize после инициализации:

---

beforeShow
Type: Function( Element input, Object inst )
Default: null

A function that takes an input field and current datepicker instance and returns an options object to update the datepicker with. It is called just before the datepicker is displayed.
Функция, которая берет поле ввода и текущее состояние Календарика и возвращает объект с опциями, которые нужно обновить у Календарика. Вызывается перед тем как Календарик показывается.

---

beforeShowDay
Type: Function( Date date )
Default: null

A function takes a date as a parameter and must return an array with [0] equal to true/false indicating whether or not this date is selectable, [1] equal to a CSS class name or "" for the default presentation, and [2] an optional popup tooltip for this date. It is called for each day in the datepicker before it is displayed.
Функция, которая берет дату, как параметр и должна вернуть массив со следующими элементами: [0] равняется true/false (истина/ложь) в зависимости от того, можно ли выбрать данную дату, [1] равняется имени класса CSS или "" (пустая строка) по дефолту, и [2] - значения тултипа для данной даты. Вызывается для каждого дня в Календарики до того, как он отображается.

---

buttonImage
Type: String
Default: ""

The URL for the popup button image. If set, the buttonText option becomes the alt value and is not directly displayed.
URL (адрес) рисунка для кнопки. Если установлена, то опция buttonText (текст на кнопке) становится значением alt и напрямую на кнопке не показывается.

Code examples: (Примеры кода: )
Initialize the datepicker with the buttonImage option specified:
Инициализация Календарика с определенной опцией buttonImage:



Get or set the buttonImage option, after initialization:
Можно получить или установить опцию buttonImage после инициализации:

---

buttonImageOnly
Type: Boolean
Default: false

Whether the button image should be rendered by itself instead of inside a button element.
Опция определяет, находится ли рисунок сам по себе, либо внутри элемента кнопка.

Code examples: (Примеры кода: )
Initialize the datepicker with the buttonImageOnly option specified:
Инициализация Календарика с определенной опцией buttonImageOnly:



Get or set the buttonImageOnly option, after initialization:
Можно получить или установить опцию buttonImageOnly после инициализации:

---

buttonText
Type: String
Default: "..."

The text to display on the trigger button. Use in conjunction with the showOn option set to "button" or "both".
Текст, который показывается на кнопке запуска. Используется в сочитании с опцией showOn, которая устанавливается как "button" (кнопка) или "both" (оба).

Code examples: (Примеры кода: )
Initialize the datepicker with the buttonText option specified:
Инициализация Календарика с определенной опцией buttonText:



Get or set the buttonText option, after initialization:
Можно получить или установить опцию buttonText после инициализации:

---

calculateWeek
Type: Function()
Default: jQuery.datepicker.iso8601Week

A function to calculate the week of the year for a given date. The default implementation uses the ISO 8601 definition: weeks start on a Monday; the first week of the year contains the first Thursday of the year.
Функция, которая считает номер недели в году для данной даты. По умолчанию выполняется с использованием определения стандарта ISO 8601: недели начинаются с понедельника; первая неделя года содержит первый четверг года.

Code examples: (Примеры кода: )
Initialize the datepicker with the calculateWeek option specified:
Инициализация Календарика с определенной опцией calculateWeek:



Get or set the calculateWeek option, after initialization:
Можно получить или установить опцию calculateWeek после инициализации:

---

changeMonth
Type: Boolean
Default: false

Whether the month should be rendered as a dropdown instead of text.
Должен ли месяц быть представлен в виде выпадающего меню, а не простого текста.

Code examples: (Примеры кода: )
Initialize the datepicker with the changeMonth option specified:
Инициализация Календарика с определенной опцией changeMonth:



Get or set the changeMonth option, after initialization:
Можно получить или установить опцию changeMonth после инициализации:

---

changeYear
Type: Boolean
Default: false

Whether the year should be rendered as a dropdown instead of text. Use the yearRange option to control which years are made available for selection.
Должен ли год быть представлен в виде выпадающего меню, а не простого текста. Используется вместе с опцией yearRange для контроля, какие года следует сделать возможными для выбора.

Code examples: (Примеры кода: )
Initialize the datepicker with the changeYear option specified:
Инициализация Календарика с определенной опцией changeYear:



Get or set the changeYear option, after initialization:
Можно получить или установить опцию changeYear после инициализации:

---

closeText
Type: String
Default: "Done"

The text to display for the close link. Use the showButtonPanel option to display this button.
Текст для показа на ссылке закрытия. Используется опция showButtonPanel для показа этой кнопки.

Code examples: (Примеры кода: )
Initialize the datepicker with the closeText option specified:
Инициализация Календарика с определенной опцией closeText:



Get or set the closeText option, after initialization:
Можно получить или установить опцию closeText после инициализации:

---

constrainInput
Type: Boolean
Default: true

When true, entry in the input field is constrained to those characters allowed by the current dateFormat option.
Если true (истина), ввод в поле ввода лимитируется только теми буквенно-цифровыми символами, которые соответствуют текущей опции dateFormat (формат даты).

Code examples: (Примеры кода: )
Initialize the datepicker with the constrainInput option specified:
Инициализация Календарика с определенной опцией constrainInput:



Get or set the constrainInput option, after initialization:
Можно получить или установить опцию constrainInput после инициализации:

---

currentText
Type: String
Default: "Today"

The text to display for the current day link. Use the showButtonPanel option to display this button.
Текст, который используется для показа ссылки на текущий день. Используйте опцию showButtonPanel для показа этой кнопки.

Code examples: (Примеры кода: )
Initialize the datepicker with the currentText option specified:
Инициализация Календарика с определенной опцией currentText:



Get or set the currentText option, after initialization:
Можно получить или установить опцию currentText после инициализации:

---

dateFormat
Type: String
Default: "mm/dd/yy"

The format for parsed and displayed dates. For a full list of the possible formats see the [[UI/Datepicker/formatDate|formatDate]] function.
Формат для парсинга и показа дат. Для полного списка фозможных форматов см функцию [[UI/Datepicker/formatDate|formatDate]].

Code examples: (Примеры кода: )
Initialize the datepicker with the dateFormat option specified:
Инициализация Календарика с определенной опцией dateFormat:



Get or set the dateFormat option, after initialization:
Можно получить или установить опцию dateFormat после инициализации:

---

dayNames
Type: Array
Default: [ "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday" ]

The list of long day names, starting from Sunday, for use as requested via the dateFormat option.
Список полных имен дней, начиная с воскресенья для использования, как запрошено через опцию dateFormat (формат даты).

Code examples: (Примеры кода: )
Initialize the datepicker with the dayNames option specified:
Инициализация Календарика с определенной опцией dayNames:



Get or set the dayNames option, after initialization:
Можно получить или установить опцию dayNames после инициализации:

---

dayNamesMin
Type: Array
Default: [ "Su", "Mo", "Tu", "We", "Th", "Fr", "Sa" ]

The list of minimised day names, starting from Sunday, for use as column headers within the datepicker.
Список кратких имен дней, начиная с воскресенья, для использования в заголовках колонок внутри Календарика.

Code examples: (Примеры кода: )
Initialize the datepicker with the dayNamesMin option specified:
Инициализация Календарика с определенной опцией dayNamesMin:



Get or set the dayNamesMin option, after initialization:
Можно получить или установить опцию dayNamesMin после инициализации:

---

dayNamesShort
Type: Array
Default: [ "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat" ]

The list of abbreviated day names, starting from Sunday, for use as requested via the dateFormat option.
Список сокращенных имен дней, начиная с воскресенья для использования, как запрошено через опцию dateFormat (формат даты).

Code examples: (Примеры кода: )
Initialize the datepicker with the dayNamesShort option specified:
Инициализация Календарика с определенной опцией dayNamesShort:



Get or set the dayNamesShort option, after initialization:
Можно получить или установить опцию dayNamesShort после инициализации:

---

defaultDate
Type: Date or Number or String
Default: null

Set the date to highlight on first opening if the field is blank. Specify either an actual date via a Date object or as a string in the current [[UI/Datepicker#option-dateFormat|dateFormat]], or a number of days from today (e.g. +7) or a string of values and periods ('y' for years, 'm' for months, 'w' for weeks, 'd' for days, e.g. '+1m +7d'), or null for today.
Устанавливает дату для выделения при первом открытии, если поле пустое. Можно определить актуальную дату через объект Date или как строку в текущем формате [[UI/Datepicker#option-dateFormat|dateFormat]] или как число дней, начиная с сегодня (н-р, +7) или как строка значений и периодов ('y' - годы, 'm' - месяцы, 'w' - недели, 'd' дни, н-р: '+1m +7d'), или как null для сегодня.

Multiple types supported:
• Date: A date object containing the default date.
• Number: A number of days from today. For example 2 represents two days from today and -1 represents yesterday.
• String: A string in the format defined by the dateFormat option, or a relative date. Relative dates must contain value and period pairs; valid periods are "y" for years, "m" for months, "w" for weeks, and "d" for days. For example, "+1m +7d" represents one month and seven days from today.

Поддерживаются множественные типы:
• Date (Дата): Объект дата, содержащий дату по умолчанию.
• Number (Число): Число дней, начиная с сегодня. Например, 2 представляет два дня, начиная с сегодня, -1 представляет вчера.
• String (Строка): Строка в формате, определяемом опцией dateFormat, или относительной датой. Относительные даты должны содержать пары значения и периоды. Корректные значения для периодов: 'y' - годы, 'm' - месяцы, 'w' - недели, 'd' дни. Н-р: '+1m +7d' представляет один месяц м семь дней, начиная с сегодня.

Code examples: (Примеры кода: )
Initialize the datepicker with the defaultDate option specified:
Инициализация Календарика с определенной опцией defaultDate:



Get or set the defaultDate option, after initialization:
Можно получить или установить опцию defaultDate после инициализации:

---

duration
Type: Number or String
Default: "normal"

Control the speed at which the datepicker appears, it may be a time in milliseconds or a string representing one of the three predefined speeds ("slow", "normal", "fast").
Контролирует скорость, с которой появляется Календарик, может быть задано временем в миллисекундах или строкой с одним из трех предопределенных названий скоростей: "slow" (медленная), "normal" (нормальная), "fast"(быстрая).

Code examples: (Примеры кода: )
Initialize the datepicker with the duration option specified:
Инициализация Календарика с определенной опцией duration:



Get or set the duration option, after initialization:
Можно получить или установить опцию duration после инициализации:

---

firstDay
Type: Integer
Default: 0

Set the first day of the week: Sunday is 0, Monday is 1, etc.
Устанавливает первый день недели: Воскресенье - 0, Понедельник - 1, и т.д.

Code examples: (Примеры кода: )
Initialize the datepicker with the firstDay option specified:
Инициализация Календарика с определенной опцией firstDay:



Get or set the firstDay option, after initialization:
Можно получить или установить опцию firstDay после инициализации:

---

gotoCurrent
Type: Boolean
Default: false

When true, the current day link moves to the currently selected date instead of today.
Если true (истина), линк текущего дня ведет к текущей выбранной дате, а не на сегодня.

Code examples: (Примеры кода: )
Initialize the datepicker with the gotoCurrent option specified:
Инициализация Календарика с определенной опцией gotoCurrent:



Get or set the gotoCurrent option, after initialization:
Можно получить или установить опцию gotoCurrent после инициализации:

---

hideIfNoPrevNext
Type: Boolean
Default: false

Normally the previous and next links are disabled when not applicable (see the minDate and maxDate options). You can hide them altogether by setting this attribute to true.
Обычно линки предыдущий и следующий отключены, если их нельзя использовать (см опции minDate и maxDate). Можно эти линки спрятать установкой атрибута hideIfNoPrevNext на значение true (истина).

Code examples: (Примеры кода: )
Initialize the datepicker with the hideIfNoPrevNext option specified:
Инициализация Календарика с определенной опцией hideIfNoPrevNext:



Get or set the hideIfNoPrevNext option, after initialization:
Можно получить или установить опцию hideIfNoPrevNext после инициализации:

---

isRTLType
Type: Boolean
Default: false

Whether the current language is drawn from right to left.
Читается ли текущий язык справа налево (арабский, идиш и т.д.).

Code examples: (Примеры кода: )
Initialize the datepicker with the isRTLType option specified:
Инициализация Календарика с определенной опцией isRTLType:



Get or set the isRTLType option, after initialization:
Можно получить или установить опцию isRTLType после инициализации:

---

maxDate
Type: Date or Number or String
Default: null

The maximum selectable date. When set to null, there is no maximum.
Максимальная дата, которую можно выбрать. Если опция установлена на null, максимальной даты нет.

Multiple types supported:
• Date: A date object containing the maximum date.
• Number: A number of days from today. For example 2 represents two days from today and -1 represents yesterday.
• String: A string in the format defined by the dateFormat option, or a relative date. Relative dates must contain value and period pairs; valid periods are "y" for years, "m" for months, "w" for weeks, and "d" for days. For example, "+1m +7d" represents one month and seven days from today.

Поддерживаются множественные типы:
• Date (Дата): Объект дата, содержащий максимальную дату.
• Number (Число): Число дней, начиная с сегодня. Например, 2 представляет два дня, начиная с сегодня, -1 представляет вчера.
• String (Строка): Строка в формате, определяемом опцией dateFormat, или относительной датой. Относительные даты должны содержать пары значения и периоды. Корректные значения для периодов: 'y' - годы, 'm' - месяцы, 'w' - недели, 'd' дни. Н-р: '+1m +7d' представляет один месяц м семь дней, начиная с сегодня.

Code examples: (Примеры кода: )
Initialize the datepicker with the maxDate option specified:
Инициализация Календарика с определенной опцией maxDate:



Get or set the maxDate option, after initialization:
Можно получить или установить опцию maxDate после инициализации:

---

minDate
Type: Date or Number or String
Default: null

The minimum selectable date. When set to null, there is no minimum.
Минимальная дата, которую можно выбрать. Если опция установлена на null, минимальной даты нет.

Multiple types supported:
• Date: A date object containing the minimum date.
• Number: A number of days from today. For example 2 represents two days from today and -1 represents yesterday.
• String: A string in the format defined by the dateFormat option, or a relative date. Relative dates must contain value and period pairs; valid periods are "y" for years, "m" for months, "w" for weeks, and "d" for days. For example, "+1m +7d" represents one month and seven days from today.

Поддерживаются множественные типы:
• Date (Дата): Объект дата, содержащий минимальную дату.
• Number (Число): Число дней, начиная с сегодня. Например, 2 представляет два дня, начиная с сегодня, -1 представляет вчера.
• String (Строка): Строка в формате, определяемом опцией dateFormat, или относительной датой. Относительные даты должны содержать пары значения и периоды. Корректные значения для периодов: 'y' - годы, 'm' - месяцы, 'w' - недели, 'd' дни. Н-р: '+1m +7d' представляет один месяц м семь дней, начиная с сегодня.

Code examples: (Примеры кода: )
Initialize the datepicker with the minDate option specified:
Инициализация Календарика с определенной опцией minDate:



Get or set the minDate option, after initialization:
Можно получить или установить опцию minDate после инициализации:

---

monthNames
Type: Array
Default: [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ]

The list of full month names, for use as requested via the dateFormat option.
Список полных имен месяцев для использования, как запрошено через опцию dateFormat (формат даты).

Code examples: (Примеры кода: )
Initialize the datepicker with the monthNames option specified:
Инициализация Календарика с определенной опцией monthNames:



Get or set the monthNames option, after initialization:
Можно получить или установить опцию monthNames после инициализации:

---

monthNamesShort
Type: Array
Default: [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ]

The list of abbreviated month names, as used in the month header on each datepicker and as requested via the dateFormat option.
Список сокращенных имен месяцев для использования в заголовках для месяцев в каждом календарике, как запрошено через опцию dateFormat (формат даты).

Code examples: (Примеры кода: )
Initialize the datepicker with the monthNamesShort option specified:
Инициализация Календарика с определенной опцией monthNamesShort:



Get or set the monthNamesShort option, after initialization:
Можно получить или установить опцию monthNamesShort после инициализации:

---

navigationAsDateFormat
Type: Boolean
Default: false

Whether the prevText and nextText options should be parsed as dates by the [[UI/Datepicker/formatDate|formatDate]] function, allowing them to display the target month names for example.
Должны ли опции prevText и nextText быть парсированы как даты функцией [[UI/Datepicker/formatDate|formatDate]], позволяя им показывать, например, имена месяцев.

Code examples: (Примеры кода: )
Initialize the datepicker with the navigationAsDateFormat option specified:
Инициализация Календарика с определенной опцией navigationAsDateFormat:



Get or set the navigationAsDateFormat option, after initialization:
Можно получить или установить опцию navigationAsDateFormat после инициализации:

---

nextText
Type: String
Default: "Next"

The text to display for the next month link. With the standard ThemeRoller styling, this value is replaced by an icon.
Текст для показа в линке следующий месяц. В стандартном стиле ThemeRoller это значение заменяется иконкой.

Code examples: (Примеры кода: )
Initialize the datepicker with the nextText option specified:
Инициализация Календарика с определенной опцией nextText:



Get or set the nextText option, after initialization:
Можно получить или установить опцию nextText после инициализации:

---

numberOfMonths
Type: Number or Array
Default: 1

The number of months to show at once.
Количество месяцев, показываемое одновременно.

Multiple types supported:
• Number: The number of months to display in a single row.
• Array: An array defining the number of rows and columns to display.

Поддерживаются множественные типы:
• Number (Число): Число месяцев для показа в одном ряду.
• Array (Массив): Массив, определяющий количество рядов и колонок для показа.

Code examples: (Примеры кода: )
Initialize the datepicker with the numberOfMonths option specified:
Инициализация Календарика с определенной опцией numberOfMonths:



Get or set the numberOfMonths option, after initialization:
Можно получить или установить опцию numberOfMonths после инициализации:

---

onChangeMonthYear
Type: Function( Integer year, Integer month, Object inst )
Default: null

Called when the datepicker moves to a new month and/or year. The function receives the selected year, month (1-12), and the datepicker instance as parameters. this refers to the associated input field.
Вызывается, когда курсор Календарика перемещается на новый месяц и/или год. Функция получает выбранный год, месяц (1-12), и состояние Календарика, как параметры. this относится к связанному полю ввода.

---

onClose
Type: Function( String dateText, Object inst )
Default: null

Called when the datepicker is closed, whether or not a date is selected. The function receives the selected date as text ("" if none) and the datepicker instance as parameters. this refers to the associated input field.
Вызывается, когда Календарик закрывается, независимо от того, выбрана ли дата. Функция получает выбранную дату как текст ("" если не выбрана) и состояние Календарика, как параметры. this относится к связанному полю ввода.

---

onSelect
Type: Function( String dateText, Object inst )
Default: null

Called when the datepicker is selected. The function receives the selected date as text and the datepicker instance as parameters. this refers to the associated input field.
Вызывается, когда дата выбрана и Календарик закрывается. Функция получает выбранную дату как текст и состояние Календарика, как параметры. this относится к связанному полю ввода.

---

prevText
Type: String
Default: "Prev"

The text to display for the previous month link. With the standard ThemeRoller styling, this value is replaced by an icon.
Текст для показа в линке предыдущий месяц. В стандартном стиле ThemeRoller это значение заменяется иконкой.

Code examples: (Примеры кода: )
Initialize the datepicker with the prevText option specified:
Инициализация Календарика с определенной опцией prevText:



Get or set the prevText option, after initialization:
Можно получить или установить опцию prevText после инициализации:

---

selectOtherMonths
Type: Boolean
Default: false

Whether days in other months shown before or after the current month are selectable. This only applies if the showOtherMonths option is set to true.
Должны ли дни других месяцев быть показаны до и после того, как выбран текущий месяц. Работает только если опция showOtherMonths установлена на значение true (истина).

Code examples: (Примеры кода: )
Initialize the datepicker with the selectOtherMonths option specified:
Инициализация Календарика с определенной опцией selectOtherMonths:



Get or set the selectOtherMonths option, after initialization:
Можно получить или установить опцию selectOtherMonths после инициализации:

---

shortYearCutoff
Type: Number or String
Default: "+10"

The cutoff year for determining the century for a date (used in conjunction with [[UI/Datepicker#option-dateFormat|dateFormat]] 'y'). Any dates entered with a year value less than or equal to the cutoff year are considered to be in the current century, while those greater than it are deemed to be in the previous century.
Значение года границы веков для определения века даты (используется в связке с [[UI/Datepicker#option-dateFormat|dateFormat]] 'y'). Любая дата, введенная с годом меньшим или равным границы года считается датой текущего века, дата с годом больше, чем граница года, считается датой прошлого века.

Multiple types supported:
• Number: A value between 0 and 99 indicating the cutoff year.
• String: A relative number of years from the current year, e.g., "+3" or "-5".

Поддерживаются множественные типы:
• Number (Число): Значение между 0 и 99, указывающее на год границы веков.
• String (Строка): Относительное число лет от текущего года, н-р, "+3" или "-5".

Code examples: (Примеры кода: )
Initialize the datepicker with the shortYearCutoff option specified:
Инициализация Календарика с определенной опцией shortYearCutoff:



Get or set the shortYearCutoff option, after initialization:
Можно получить или установить опцию shortYearCutoff после инициализации:

---

showAnim
Type: String
Default: "show"

The name of the animation used to show and hide the datepicker. Use "show" (the default), "slideDown", "fadeIn", any of the jQuery UI effects. Set to an empty string to disable animation.
Имя анимации, которая используется для показа и скрытия Календарика. Используется "show" ("показать", это по умолчанию), "slideDown", "fadeIn", любой из эффектов jQuery UI. Установка на пустую строку отменяет анимацию.

Code examples: (Примеры кода: )
Initialize the datepicker with the showAnim option specified:
Инициализация Календарика с определенной опцией showAnim:



Get or set the showAnim option, after initialization:
Можно получить или установить опцию showAnim после инициализации:

---

showButtonPanel
Type: Boolean
Default: false

Whether to show the button panel.
Показывать ли кнопочную панель.

Code examples: (Примеры кода: )
Initialize the datepicker with the showButtonPanel option specified:
Инициализация Календарика с определенной опцией showButtonPanel:



Get or set the showButtonPanel option, after initialization:
Можно получить или установить опцию showButtonPanel после инициализации:

---

showCurrentAtPos
Type: Number
Default: 0

When displaying multiple months via the numberOfMonths option, the showCurrentAtPos option defines which position to display the current month in.
Когда показываются несколько месяцев через опцию numberOfMonths, опция showCurrentAtPos определяет позицию текущего месяца.

Code examples: (Примеры кода: )
Initialize the datepicker with the showCurrentAtPos option specified:
Инициализация Календарика с определенной опцией showCurrentAtPos:



Get or set the showCurrentAtPos option, after initialization:
Можно получить или установить опцию showCurrentAtPos после инициализации:

---

showMonthAfterYear
Type: Boolean
Default: false

Whether to show the month after the year in the header.
Показывать ли месяц после года в заголовке.

Code examples: (Примеры кода: )
Initialize the datepicker with the showMonthAfterYear option specified:
Инициализация Календарика с определенной опцией showMonthAfterYear:



Get or set the showMonthAfterYear option, after initialization:
Можно получить или установить опцию showMonthAfterYear после инициализации:

---

showOn
Type: String
Default: "focus"

When the datepicker should appear. The datepicker can appear when the field receives focus ("focus"), when a button is clicked ("button"), or when either event occurs ("both").
Где должен появиться Календарик. Календарик может появиться, когда на поле наведен фокус ("focus"), когда кнопка кликнута ("button"), или когда какое-то любое событие имело место быть ("both").

Code examples: (Примеры кода: )
Initialize the datepicker with the showOn option specified:
Инициализация Календарика с определенной опцией showOn:



Get or set the showOn option, after initialization:
Можно получить или установить опцию showOn после инициализации:

---

showOptions
Type: Object
Default: {}

If using one of the jQuery UI effects for the showAnim option, you can provide additional settings for that animation via this option.
Если используется один из эффектов jQuery UI для опции showAnim, можно передать дополнительные установки для анимации через данную опцию.

Code examples: (Примеры кода: )
Initialize the datepicker with the showOptions option specified:
Инициализация Календарика с определенной опцией showOptions:



Get or set the showOptions option, after initialization:
Можно получить или установить опцию showOptions после инициализации:

---

showOtherMonths
Type: Boolean
Default: false

Whether to display dates in other months (non-selectable) at the start or end of the current month. To make these days selectable use the selectOtherMonths option.
Показывать ли даты других месяцев (не выбираемые) в начале или конце текущего месяца. Чтобы сделать эти дни выбираемыми следует использовать опцию selectOtherMonths.

Code examples: (Примеры кода: )
Initialize the datepicker with the showOtherMonths option specified:
Инициализация Календарика с определенной опцией showOtherMonths:



Get or set the showOtherMonths option, after initialization:
Можно получить или установить опцию showOtherMonths после инициализации:

---

showWeek
Type: Boolean
Default: false

When true, a column is added to show the week of the year. The calculateWeek option determines how the week of the year is calculated. You may also want to change the firstDay option.
Когда true (истина), добавляется колонка для показа недели года. Опция calculateWeek определяет, каким образом рассчитывается номер недели года. Также вы можете изменить опцию firstDay.

Code examples: (Примеры кода: )
Initialize the datepicker with the showWeek option specified:
Инициализация Календарика с определенной опцией showWeek:



Get or set the showWeek option, after initialization:
Можно получить или установить опцию showWeek после инициализации:

---

stepMonths
Type: Number
Default: 1

Set how many months to move when clicking the previous/next links.
Установка, на какое количество месяцев двигаться при нажатии линков предыдущий/следующий.

Code examples: (Примеры кода: )
Initialize the datepicker with the stepMonths option specified:
Инициализация Календарика с определенной опцией stepMonths:



Get or set the stepMonths option, after initialization:
Можно получить или установить опцию stepMonths после инициализации:

---

weekHeader
Type: String
Default: "Wk"

The text to display for the week of the year column heading. Use the showWeek option to display this column.
Текст для показа в заголовке колонки недели года. Используйте опцию showWeek, чтобы показать эту колонку.

Code examples: (Примеры кода: )
Initialize the datepicker with the weekHeader option specified:
Инициализация Календарика с определенной опцией weekHeader:



Get or set the weekHeader option, after initialization:
Можно получить или установить опцию weekHeader после инициализации:

---

yearRange
Type: String
Default: "c-10:c+10"

The range of years displayed in the year drop-down: either relative to today's year ("-nn:+nn"), relative to the currently selected year ("c-nn:c+nn"), absolute ("nnnn:nnnn"), or combinations of these formats ("nnnn:-nn"). Note that this option only affects what appears in the drop-down, to restrict which dates may be selected use the minDate and/or maxDate options.
Интервал лет, которые показываются в выпадающем меню: либо относительно текущего года ("-nn:+nn"), либо относительно текущего выбранного года ("c-nn:c+nn"), либо абсолютное значение ("nnnn:nnnn"), либо комбинация этих форматов ("nnnn:-nn"). Обратите внимание, данная опция влияет только на функциональность выпадающего меню, для ограничения, какие даты можно выбрать следует использовать опции minDate и/или maxDate.

Code examples: (Примеры кода: )
Initialize the datepicker with the yearRange option specified:
Инициализация Календарика с определенной опцией yearRange:



Get or set the yearRange option, after initialization:
Можно получить или установить опцию yearRange после инициализации:

---

yearSuffix
Type: String
Default: ""

Additional text to display after the year in the month headers.
Дополнительный текст для показа после года в заголовках месяцев.

Code examples: (Примеры кода: )
Initialize the datepicker with the yearSuffix option specified:
Инициализация Календарика с определенной опцией yearSuffix:



Get or set the yearSuffix option, after initialization:
Можно получить или установить опцию yearSuffix после инициализации:

---

Methods (Методы)

---

destroy()
Removes the datepicker functionality completely. This will return the element back to its pre-init state.
• This method does not accept any arguments.

Полностью удаляет функциональность календарика. Возвращает элемент обратно в состояние до инициализации.
• Этот метод не принимает никаких аргументов.

Code examples: (Примеры кода: )
Invoke the destroy method:
Запуск метода destroy (разрушить):

---

dialog( date [, onSelect ] [, settings ] [, pos ] )
Opens the datepicker in a dialog box.

• date
Type: String or Date
The initial date.

• onSelect
Type: Function()
A callback function when a date is selected. The function receives the date text and date picker instance as parameters.

• settings
Type: Options
The new settings for the date picker.

• pos
Type: Number[2] or MouseEvent
The position of the top/left of the dialog as [x, y] or a MouseEvent that contains the coordinates. If not specified the dialog is centered on the screen.

Открывает Календарик в области диалога.

• date
Type (Тип): Строка или Дата
Дата инициализации.

• onSelect
Type (Тип): Function()
Вызываемая функция при выборе даты. Функция получает дату в виде текста и текущее состояние Календарика как параметры.

• settings
Type (Тип): Options (опции)
Новые установки для Календарика.

• pos
Type (Тип): Число[2] или Событие Мыши
Позиция вверх/лево диалога как [x, y] или Событие Мыши, которое содержит координаты. Если не определено, диалог располагается по центру экрана.

Code examples: (Примеры кода: )
Invoke the dialog method:
Запуск метода dialog (диалог):

---

getDate()
Returns: Date
Возвращает: Date (Дата)

Returns the current date for the datepicker or null if no date has been selected.
• This method does not accept any arguments.

Возвращает текущую дату для Календарика или null если никакая дата не была выбрана.
• Этот метод не принимает никаких аргументов.

Code examples: (Примеры кода: )
Invoke the getDate method:
Запуск метода getDate (получить Дату):

---

hide()
Close a previously opened date picker.
• This method does not accept any arguments.

Закрывает открытый Календарик.
• Этот метод не принимает никаких аргументов.

Code examples: (Примеры кода: )
Invoke the hide() method:
Запуск метода hide() (спрятать):

---

isDisabled()
Returns: Boolean
Возвращает: Boolean (Да или Нет)

Determine whether a date picker has been disabled.
• This method does not accept any arguments.

Определяет, был ли Календарик выключен.
• Этот метод не принимает никаких аргументов.

Code examples: (Примеры кода: )
Invoke the isDisabled() method:
Запуск метода isDisabled() (Выключен?):

---

option( optionName )
Returns: Object
Gets the value currently associated with the specified optionName.
Получает значение, связанное с определенным optionName (имя опции).
• optionName
Type: String
The name of the option to get.
Имя опции, для которой получаем значение.

Code examples: (Примеры кода: )
Invoke the method:
Запуск метода:

---

option()
Returns: PlainObject
Gets an object containing key/value pairs representing the current datepicker options hash.
• This method does not accept any arguments.

Получает объект, содержащий пары key/value (ключ/значение), представляющий текущее состояние набора значений Календарика.
• Этот метод не принимает никаких аргументов.

Code examples: (Примеры кода: )
Invoke the method:
Запуск метода:

---

option( optionName, value )
Sets the value of the datepicker option associated with the specified optionName.
Устанавливает значение опции Календарика, связанное с определенным optionName (именем опции).

• optionName
Type: String
The name of the option to set.
Имя опции для установки.

• value
Type: Object
A value to set for the option.
Значение, которое устанавливается для опции.

Code examples: (Примеры кода: )
Invoke the method:
Запуск метода:

---

option( options )
Sets one or more options for the datepicker.

Устанавливает одну или более опций для Календарика.

• options
Type: Object
A map of option-value pairs to set.
Карта пар option-value (опция-значение) для установки.

Code examples: (Примеры кода: )
Invoke the method:
Запуск метода:

---

refresh()
Redraw the date picker, after having made some external modifications.
• This method does not accept any arguments.

Перерисовывает Календарик, после того, как имели место произойти внешние изменения.
• Этот метод не принимает никаких аргументов.

Code examples: (Примеры кода: )
Invoke the method:
Запуск метода:

---

setDate( date )
Sets the date for the datepicker. The new date may be a Date object or a string in the current date format (e.g., "01/26/2009"), a number of days from today (e.g., +7) or a string of values and periods ("y" for years, "m" for months, "w" for weeks, "d" for days, e.g., "+1m +7d"), or null to clear the selected date.
• date Type: String or Date The new date.

Устанавливает дату для Календарика. Новая дата должна быть объектом типа Дата или строкой в текущем формате для даты (н-р., "01/26/2009"), или числом дней от сегодня (н-р., +7), или строкой пар значение-период ("y"-года, "m"-месяцы, "w"-недели, "d"-дни, н-р., "+1m +7d"), или null для очистки значения выбранной даты.
• date Type (тип): String or Date Новая дата.

Code examples: (Примеры кода: )
Invoke the setDate method:
Запуск метода setDate (установить Дату):

---

show()
Open the date picker. If the datepicker is attached to an input, the input must be visible for the datepicker to be shown.
• This method does not accept any arguments.

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

Code examples: (Примеры кода: )
Invoke the show method:
Запуск метода show (показать):

---

widget()
Returns a jQuery object containing the datepicker.
• This method does not accept any arguments.

Возвращает объект jQuery, содержащий Календарик.
• Этот метод не принимает никаких аргументов.

Code examples: (Примеры кода: )
Invoke the widget method:
Запуск метода виджета:

---

Events (События)

---

Datepicker Widget
version added: 1.0
Description: Select a date from a popup or inline calendar.
Описание: Выбирает дату из поп-апа или линейного Календаря.

---

Overview (Обзор)
The jQuery UI Datepicker is a highly configurable plugin that adds datepicker functionality to your pages. You can customize the date format and language, restrict the selectable date ranges and add in buttons and other navigation options easily.

By default, the datepicker calendar opens in a small overlay when the associated text field gains focus. For an inline calendar, simply attach the datepicker to a div or span.

Календарик (Datepicker) плагина UI библиотеки jQuery - это очень гибкий плагин с множеством разных функциональных возможностей. Вы можете адаптировать формат даты и язык, ограничивать интервалы дат, а также легко добавлять кнопки и использовать другие навигационные возможности.

По умолчанию Календарик (Datepicker) открывается в небольшом оверлее, когда наводится фокус на связанное с Календариком текстовое поле. Для линейного Календарика просто привяжите Календарик к диву (div) или спану (span).

---

Keyboard interaction (Клавиши Клавиатуры)
While the datepicker is open, the following key commands are available:
• PAGE UP: Move to the previous month.
• PAGE DOWN: Move to the next month.
• CTRL+PAGE UP: Move to the previous year.
• CTRL+PAGE DOWN: Move to the next year.
• CTRL+HOME: Move to the current month. Open the datepicker if closed.
• CTRL+LEFT: Move to the previous day.
• CTRL+RIGHT: Move to the next day.
• CTRL+UP: Move to the previous week.
• CTRL+DOWN: Move the next week.
• ENTER: Select the focused date.
• CTRL+END: Close the datepicker and erase the date.
• ESCAPE: Close the datepicker without selection.

Когда Календарик открыт, возможны следующие команды с клавиатуры:
• PAGE UP: Двигаемся на предыдущий месяц.
• PAGE DOWN: Двигаемся на следующий месяц.
• CTRL+PAGE UP: Двигаемся на предыдущий год.
• CTRL+PAGE DOWN: Двигаемся на следующий год.
• CTRL+HOME: Двигаемся на текущий месяц. Открывает Календарик, если тот был закрыт.
• CTRL+LEFT: Двигаемся на предыдущий день.
• CTRL+RIGHT: Двигаемся на следующий день.
• CTRL+UP: Двигаемся на предыдущую неделю.
• CTRL+DOWN: Двигаемся на следующую неделю.
• ENTER: Выбор даты на фокусе.
• CTRL+END: Закрываем Календарик и удаляем дату.
• ESCAPE: Закрываем Календарик без выбора.

---

Utility functions (Функции Утилиты)
• $.datepicker.setDefaults( settings ) - Set settings for all datepicker instances.
• $.datepicker.formatDate( format, date, settings ) - Format a date into a string value with a specified format.
• $.datepicker.parseDate( format, value, settings ) - Extract a date from a string value with a specified format.
• $.datepicker.iso8601Week( date ) - Determine the week of the year for a given date: 1 to 53.
• $.datepicker.noWeekends - Set as beforeShowDay function to prevent selection of weekends.

• $.datepicker.setDefaults( settings ) - Устанавливает все сеттинги Календарика по дефолту.
• $.datepicker.formatDate( format, date, settings ) - Форматирует дату в строку по заданому формату.
• $.datepicker.parseDate( format, value, settings ) - Выделяет дату из строки по заданому формату.
• $.datepicker.iso8601Week( date ) - Определяет неделю года для данной даты: 1 to 53.
• $.datepicker.noWeekends - Устанавливает также как функция beforeShowDay для предотвращения выбора концов недель.

---

Localization (Локализация, в т.ч. Русификация и т.д.)
Datepicker provides support for localizing its content to cater for different languages and date formats. Each localization is contained within its own file with the language code appended to the name, e.g., jquery.ui.datepicker-fr.js for French. The desired localization file should be included after the main datepicker code. Each localization file adds its settings to the set of available localizations and automatically applies them as defaults for all instances.

The $.datepicker.regional attribute holds an array of localizations, indexed by language code, with "" referring to the default (English). Each entry is an object with the following attributes: closeText, prevText, nextText, currentText, monthNames, monthNamesShort, dayNames, dayNamesShort, dayNamesMin, weekHeader, dateFormat, firstDay, isRTL, showMonthAfterYear, and yearSuffix.

Календарик дает возможность локализации для разных языков и форматов дат. Каждая локализация содержится внутри собственного файла с кодом языка, добавляемого к имени файла, н-р, jquery.ui.datepicker-ru.js для русского языка, jquery.ui.datepicker-fr.js для французского языка. Желаемый файл локализации должен быть включен после главного кода Календарика. Каждый файл локализации добавляет свои установки к множеству допустимых локализаций и автоматически обращается к ним, как к установкам по умолчанию во всех случаях.

Аттрибуты $.datepicker.regional содержат массив локализаций, индексируемый с помощью индекса языка, "" (пустая строка) относится к дефотному английскому (English). Каждый пункт есть объект со следующими аттрибутами: closeText (закрыть текст), prevText (предыдущий текст), nextText (следующий текст), currentText (текущий текст), monthNames (имена месяцев), monthNamesShort (имена месяцев короткие), dayNames (имена дней), dayNamesShort (имена дней короткие), dayNamesMin (имена дней минимальные), weekHeader (заголовок недель), dateFormat (формат даты), firstDay (первый день), isRTL (язык ли это с обратным направлением - справа налево), showMonthAfterYear (показывать ли месяц после года), and yearSuffix (суффикс года).

You can restore the default localizations with:
Вы можете восстановить локализацию по умолчанию:
$.datepicker.setDefaults( $.datepicker.regional[ "" ] );

And can then override an individual datepicker for a specific locale:
И можно затем переписать индивидуальный календарик для особой локали:
$( selector ).datepicker( $.datepicker.regional[ "fr" ] );

---

Additional Notes (Дополнительная информация)
• This widget requires some functional CSS, otherwise it won't work. If you build a custom theme, use the widget's specific CSS file as a starting point.
• Этот виджет требует определенных стилей CSS, иначе он не будет работать. Если вы используете адаптированную схему, оттолкитесь в своей разработке от специализированного файла CSS.

---

Examples: (Примеры: )

---

Example: A simple jQuery UI Datepicker.
Этот пример можно посмотреть здесь.
Этот же пример с добавлением русской локализации здесь.

---

Примеры Календариков на этом сайте: Дефолтный, Форматы дат, Мини Макси, Локализованный, Альтернативный показ, Линейный, Кнопочный, Годично-Месячный, Датированный, Недельный, Многомесячный, Триггерный, Анимационный, Интервальный.

---