tessl/npm-jquery-datetimepicker

jQuery plugin for date and time selection combining both date picker and time picker functionality with extensive customization and internationalization support

—

Pending

Quality

Pending

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

Securityby

Pending

The risk profile of this skill

Overview

Eval results

Files

Global API

Name: tessl/npm-jquery-datetimepicker
Author: tessl

Static methods and constants available on the $.datetimepicker namespace for global configuration and utilities.

Capabilities

Locale Management

Set global locale configuration that applies to all datetimepicker instances.

/**
 * Set global locale for all datetimepicker instances
 * @param locale - Locale code (e.g., 'en', 'de', 'fr')
 */
$.datetimepicker.setLocale(locale: string): void;

Usage Examples:

// Set German locale globally
$.datetimepicker.setLocale('de');

// All subsequent datetimepicker instances will use German locale
$('#date1').datetimepicker(); // Uses German
$('#date2').datetimepicker(); // Uses German

// Switch to French
$.datetimepicker.setLocale('fr');
$('#date3').datetimepicker(); // Uses French

Supported Locales:

'ar' - Arabic
'az' - Azerbaijanian (Azeri)
'bg' - Bulgarian
'bs' - Bosnian
'ca' - Catalan
'ch' - Simplified Chinese
'cs' - Czech (Čeština)
'da' - Danish (Dansk)
'de' - German
'el' - Greek (Ελληνικά)
'en' - English (default)
'es' - Spanish
'et' - Estonian (Eesti)
'eu' - Basque (Euskara)
'fa' - Persian/Farsi
'fi' - Finnish (Suomi)
'fr' - French
'gl' - Galician (Galego)
'he' - Hebrew (עברית)
'hr' - Croatian (Hrvatski)
'hu' - Hungarian
'id' - Indonesian
'is' - Icelandic
'it' - Italian
'ja' - Japanese
'km' - Khmer (ភាសាខ្មែរ)
'ko' - Korean (한국어)
'kr' - Korean
'lt' - Lithuanian (lietuvių)
'lv' - Latvian (Latviešu)
'mk' - Macedonian (Македонски)
'mn' - Mongolian (Монгол)
'nl' - Dutch
'no' - Norwegian
'pl' - Polish
'pt' - Portuguese
'ro' - Romanian
'ru' - Russian
'se' - Swedish
'sk' - Slovak (Slovenčina)
'sl' - Slovenian (Slovenščina)
'sq' - Albanian (Shqip)
'sr' - Serbian Cyrillic (Српски)
'sv' - Swedish (Svenska)
'th' - Thai
'tr' - Turkish
'ug' - Uyghur (ئۇيغۇرچە)
'uk' - Ukrainian
'vi' - Vietnamese
'zh' - Simplified Chinese (简体中文)

Date Formatter Management

Configure custom date formatting and parsing.

/**
 * Set custom date formatter for parsing and formatting dates
 * @param dateFormatter - Formatter name or custom formatter object
 */
$.datetimepicker.setDateFormatter(dateFormatter: string | DateFormatter): void;

interface DateFormatter {
    parseDate(dateString: string, format: string): Date;
    formatDate(date: Date, format: string): string;
}

Default Options Access

Access and modify the global default options for all datetimepicker instances.

/**
 * Global default options object that can be modified to change defaults for all instances
 */
$.fn.datetimepicker.defaults: DateTimePickerOptions;

Usage Examples:

// Modify global default format
$.fn.datetimepicker.defaults.format = 'Y-m-d H:i';

// Change global default step size
$.fn.datetimepicker.defaults.step = 30;

// Set global defaults for behavior
$.fn.datetimepicker.defaults.closeOnDateSelect = true;
$.fn.datetimepicker.defaults.timepicker = false;

// All subsequent datetimepicker instances will use these defaults
$('#date1').datetimepicker(); // Uses Y-m-d H:i format, 30 min steps, date-only
$('#date2').datetimepicker(); // Same defaults applied

// Use a named formatter (if available)
$.datetimepicker.setDateFormatter('moment');

// Use custom formatter
$.datetimepicker.setDateFormatter({
    parseDate: function(dateString, format) {
        // Custom parsing logic
        return new Date(dateString);
    },
    formatDate: function(date, format) {
        // Custom formatting logic  
        return date.toISOString().split('T')[0];
    }
});

Standard Date Format Constants

Pre-defined date format constants for common standards.

interface StandardFormats {
    /** RFC 2822 format: 'D, d M Y H:i:s O' */
    readonly RFC_2822: string;
    /** ATOM format: 'Y-m-d\TH:i:sP' */
    readonly ATOM: string;
    /** ISO 8601 format: 'Y-m-d\TH:i:sO' */
    readonly ISO_8601: string;
    /** RFC 822 format: 'D, d M y H:i:s O' */
    readonly RFC_822: string;
    /** RFC 850 format: 'l, d-M-y H:i:s T' */
    readonly RFC_850: string;
    /** RFC 1036 format: 'D, d M y H:i:s O' */
    readonly RFC_1036: string;
    /** RFC 1123 format: 'D, d M Y H:i:s O' */
    readonly RFC_1123: string;
    /** RSS format: 'D, d M Y H:i:s O' */
    readonly RSS: string;
    /** W3C format: 'Y-m-d\TH:i:sP' */
    readonly W3C: string;
}

Usage Examples:

// Use ISO 8601 format
$('#iso-date').datetimepicker({
    format: $.datetimepicker.ISO_8601
});

// Use RFC 2822 format
$('#rfc-date').datetimepicker({
    format: $.datetimepicker.RFC_2822
});

// Use ATOM format for feeds
$('#atom-date').datetimepicker({
    format: $.datetimepicker.ATOM
});

// List all available formats
console.log('Available formats:');
console.log('RFC_2822:', $.datetimepicker.RFC_2822);
console.log('ATOM:', $.datetimepicker.ATOM);
console.log('ISO_8601:', $.datetimepicker.ISO_8601);
console.log('W3C:', $.datetimepicker.W3C);

Format Constants Values

// Actual format string values
$.datetimepicker.RFC_2822  // 'D, d M Y H:i:s O'
$.datetimepicker.ATOM      // 'Y-m-d\TH:i:sP' 
$.datetimepicker.ISO_8601  // 'Y-m-d\TH:i:sO'
$.datetimepicker.RFC_822   // 'D, d M y H:i:s O'
$.datetimepicker.RFC_850   // 'l, d-M-y H:i:s T'
$.datetimepicker.RFC_1036  // 'D, d M y H:i:s O'
$.datetimepicker.RFC_1123  // 'D, d M Y H:i:s O'
$.datetimepicker.RSS       // 'D, d M Y H:i:s O'
$.datetimepicker.W3C       // 'Y-m-d\TH:i:sP'

Global Configuration Patterns

Common patterns for global configuration.

Usage Examples:

// Set global defaults for all instances
$.fn.datetimepicker.defaults.format = 'Y-m-d H:i';
$.fn.datetimepicker.defaults.step = 30;
$.datetimepicker.setLocale('en');

// Initialize multiple pickers with consistent settings
$('.datetime-picker').datetimepicker(); // All use global defaults

// Temporary locale change
var originalLocale = 'en';
$.datetimepicker.setLocale('de');
$('#german-date').datetimepicker();
$.datetimepicker.setLocale(originalLocale); // Restore

// Application-wide date format
$.datetimepicker.setLocale('en');
$.fn.datetimepicker.defaults.format = $.datetimepicker.ISO_8601;
$.fn.datetimepicker.defaults.formatDate = 'Y-m-d';
$.fn.datetimepicker.defaults.formatTime = 'H:i:s';