Categories

.uiDatepicker()

Categories: UI

.uiDatepicker( [ options ] )

Subclass: ep

Inherit: (Subclass: ep) .uiValidate()

Plugin: ep.ui.datepicker

Description: Add date selection from calendar handling for input elements.

  • .uiDatepicker( [ options ] )

    version added: 6.11.0

    options   A map of additional options pass to the method.

The .uiDatepicker() method add validate handling to a input elements.

The .uiDatepicker() method is a validation input also and using the validation type date from the ep.validate module. Have a look at the additional options, some options are only available for a special validation types.

  • Apply .uiDatepicker() to input element named date.

    HTML:
    <form>
      <input type="text" name="date" />
    </form>
    
    Code:
    ep(':input[name=date]')
        .uiDatepicker({
            type:       'date',
            format:     'd',
            time:       false
        });
    
    
  • type

    version added: 6.11.0

    The value respectively validation type must be 'date'.

    Default: date

  • format

    version added: 6.11.0

    A date formatter [look at the jQuery.i18n plugin].

    Default: l

  • min

    version added: 6.11.0

    A local timestamp (not UTC) as minimum valid date.

  • max

    version added: 6.11.0

    A local timestamp (not UTC) as maximum valid date.

  • showOn

    version added: 6.11.0

    A handle indication, how to show the datepicker. Supported handles: 'focus', 'button', 'both' (button and focus) or 'inline'.

    Default: button

  • showOn

    version added: 6.11.0

    A duration for show and hide effect. [look at jQuery.show() or jQuery.hide() for supported durations].

    Default: normal

  • show

    version added: 6.11.0

    One off the supported show effects: 'show', 'fadeIn' or 'slideIn'.

    Default: fadeIn

  • hide

    version added: 6.11.0

    One off the supported hide effects: 'hide', 'fadeOut' or 'slideOut'.

    Default: fadeIn

  • weekDaysAvailable

    version added: 6.11.0

    An array of 7 weekdays with indications wether a day is available. Week starts on sunday.

    Default: [1,1,1,1,1,1,1]

  • numberOfMonths

    version added: 6.11.0

    Set how many months to show at once.

    Default: 1

  • showOtherMonth

    version added: 6.11.0

    Display dates in other months (non-selectable) at the start or end of the current month. To make these days selectable use selectOtherMonths.

    Default: true

  • selectOtherMonth

    version added: 6.11.0

    When true days in other months shown before or after the current month are selectable. This only applies if showOtherMonths is also true.

    Default: false

  • changeMonth

    version added: 6.11.0

    Allows you to change the month by selecting from a drop-down list. You can enable this feature by setting the attribute to true.

    Default: true

  • changeYear

    version added: 6.11.0

    Allows you to change the year by selecting from a drop-down list. You can enable this feature by setting the attribute to true. Use the yearRange option to control which years are made available for selection.

    Default: true

  • time

    version added: 6.11.0

    Allows you to select time also. Requires a format which support time.

    Default: true

  • timeStep

    version added: 6.11.0

    A difference to next/previous step in minutes.

    Default: 15

  • show

    • .uiDatepicker( 'show' )

      version added: 6.11.0

    Call up a previously attached date picker.

  • hide

    • .uiDatepicker( 'hide' )

      version added: 6.11.0

    Close a previously opened date picker.

  • getDate

    • .uiDatepicker( 'getDate' )

      version added: 6.11.0

    Returns the current date for the datepicker as ep.Date() object.