Merge pull request #634 from xdan/master

Show 2 months in calendar at the same time
This commit is contained in:
Valeriy 2018-01-23 10:52:45 +05:00 committed by GitHub
commit 5bc1822c50
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
18 changed files with 1238 additions and 1247 deletions

3
.gitignore vendored
View File

@ -1,3 +0,0 @@
parse.php
bower_components
node_modules

View File

@ -2,6 +2,14 @@
[Doc.tpl](https://github.com/xdan/datetimepicker/blob/master/doc.tpl)
This file will be automatically displayed on the site
# Installation
```
npm install jquery-datetimepicker
OR
yarn add jquery-datetimepicker
```
# datetimepicker
==============
@ -9,7 +17,7 @@ This file will be automatically displayed on the site
Use this:
```javascript
$.datetimepicker.setLocale('en');
jQuery.datetimepicker.setLocale('en');
```
[Documentation][doc]
@ -47,6 +55,12 @@ Install:
2. Run `npm install`. npm will look at `package.json` and automatically install the necessary dependencies.
3. Run `bower install`, which installs front-end packages defined in `bower.json`.
Notice: If you use Bower v1.5.2, you will get error: `The "main" field cannot contain minified files`
You can regress to version 1.3.12
1. `npm uninstall bower -g`
2. `npm install -g bower@1.3.12`
Build:
- `npm run build`

View File

@ -1,6 +1,6 @@
{
"name": "datetimepicker",
"version": "2.5.3",
"version": "2.5.11",
"main": [
"build/jquery.datetimepicker.full.min.js",
"jquery.datetimepicker.css"

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1,6 +1,6 @@
{
"name": "datetimepicker",
"version": "2.5.3",
"version": "2.5.4",
"title": "jQuery Date and Time picker",
"description": "jQuery plugin for date, time, or datetime manipulation in form",
"keywords": [

126
doc.tpl
View File

@ -39,7 +39,7 @@ jQuery('#datetimepicker_dark').datetimepicker({
[include scripts/pp/reklama1.php]
<h2>How do I use it?</h2>
<p>First include to page css and js files</p>
<pre><code data-language="html">&lt;!-- this should go after your &lt;/body&gt; --&gt;
<pre><code class="language-html">&lt;!-- this should go after your &lt;/body&gt; --&gt;
&lt;link rel="stylesheet" type="text/css" href="jquery.datetimepicker.css"/ &gt;
&lt;script src="jquery.js"&gt;&lt;/script&gt;
&lt;script src="build/jquery.datetimepicker.full.min.js"&gt;&lt;/script&gt;</code></pre>
@ -47,9 +47,9 @@ jQuery('#datetimepicker_dark').datetimepicker({
<hr id="Simple" />
<h4>Simple init DateTimePicker Example <a href="#Simple">#</a></h4>
<p>HTML</p>
<pre><code data-language="html">&lt;input id="datetimepicker" type="text" &gt;</code></pre>
<pre><code class="language-html">&lt;input id="datetimepicker" type="text" &gt;</code></pre>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">jQuery('#datetimepicker').datetimepicker();</code></pre>
<pre><code class="language-javascript">jQuery('#datetimepicker').datetimepicker();</code></pre>
<p><strong>Result</strong></p>
<p><input id="_datetimepicker" type="text" value="2014/03/15 05:06" /></p>
<script type="text/javascript">// <![CDATA[
@ -59,7 +59,7 @@ jQuery(function(){jQuery('#_datetimepicker').datetimepicker();});
<h4>i18n DatePicker Example <a href="#i18n">#</a></h4>
<p>All supported languages <a href="#lang">here</a></p>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">jQuery.datetimepicker.setLocale('de');
<pre><code class="language-javascript">jQuery.datetimepicker.setLocale('de');
jQuery('#datetimepicker1').datetimepicker({
i18n:{
@ -98,7 +98,7 @@ format:'d.m.Y'
<hr id="TimePicker" />
<h4>Only TimePicker Example <a href="#TimePicker">#</a></h4>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">jQuery('#datetimepicker2').datetimepicker({
<pre><code class="language-javascript">jQuery('#datetimepicker2').datetimepicker({
datepicker:false,
format:'H:i'
});</code></pre>
@ -114,7 +114,7 @@ jQuery('#_datetimepicker2').datetimepicker({
// ]]></script>
<h3 id="startdateex">Date Time Picker start date <a href="#startdateex">#</a></h3>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">jQuery('#datetimepicker_start_time').datetimepicker({
<pre><code class="language-javascript">jQuery('#datetimepicker_start_time').datetimepicker({
startDate:'+1971/05/01'//or 1986/12/08
});</code></pre>
<p><strong>Result</strong></p>
@ -128,7 +128,7 @@ jQuery(function(){
// ]]></script>
<h3 id="unixtime">Date Time Picker from unixtime <a href="#unixtime">#</a></h3>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">jQuery('#datetimepicker_unixtime').datetimepicker({
<pre><code class="language-javascript">jQuery('#datetimepicker_unixtime').datetimepicker({
format:'unixtime'
});</code></pre>
<p><strong>Result</strong></p>
@ -143,7 +143,7 @@ jQuery(function(){
<hr id="Inline" />
<h4>Inline DateTimePicker Example <a href="#Inline">#</a></h4>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">jQuery('#datetimepicker3').datetimepicker({
<pre><code class="language-javascript">jQuery('#datetimepicker3').datetimepicker({
format:'d.m.Y H:i',
inline:true,
lang:'ru'
@ -163,12 +163,12 @@ jQuery('#_datetimepicker3').datetimepicker({
<h4>Icon trigger <a href="#trigger">#</a></h4>
<p>Click the icon next to the input field to show the datetimepicker</p>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">jQuery('#datetimepicker4').datetimepicker({
<pre><code class="language-javascript">jQuery('#datetimepicker4').datetimepicker({
format:'d.m.Y H:i',
lang:'ru'
});</code></pre>
<p>and handler onclick event</p>
<pre><code data-language="javascript">jQuery('#image_button').click(function(){
<pre><code class="language-javascript">jQuery('#image_button').click(function(){
jQuery('#datetimepicker4').datetimepicker('show'); //support hide,show and destroy command
});</code></pre>
<p><strong>Result</strong></p>
@ -192,7 +192,7 @@ jQuery('#image_button').click(function(){
<hr id="allowTimes" />
<h4>allowTimes options TimePicker Example <a href="#allowTimes">#</a></h4>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">jQuery('#datetimepicker5').datetimepicker({
<pre><code class="language-javascript">jQuery('#datetimepicker5').datetimepicker({
datepicker:false,
allowTimes:[
'12:00', '13:00', '15:00',
@ -212,7 +212,7 @@ jQuery('#_datetimepicker5').datetimepicker({
<hr id="onChangeDateTime" />
<h4>handler onChangeDateTime Example <a href="#onChangeDateTime">#</a></h4>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">jQuery('#datetimepicker6').datetimepicker({
<pre><code class="language-javascript">jQuery('#datetimepicker6').datetimepicker({
timepicker:false,
onChangeDateTime:function(dp,$input){
alert($input.val())
@ -233,7 +233,7 @@ jQuery('#_datetimepicker6').datetimepicker({
<hr id="mindate" />
<h4>minDate and maxDate Example <a href="#mindate">#</a></h4>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">jQuery('#datetimepicker7').datetimepicker({
<pre><code class="language-javascript">jQuery('#datetimepicker7').datetimepicker({
timepicker:false,
formatDate:'Y/m/d',
minDate:'-1970/01/02',//yesterday is minimum date(for today use 0 or -1970/01/01)
@ -254,7 +254,7 @@ jQuery('#_datetimepicker7').datetimepicker({
<hr id="mask" />
<h4>Use mask input Example <a href="#mask">#</a></h4>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">jQuery('#datetimepicker_mask').datetimepicker({
<pre><code class="language-javascript">jQuery('#datetimepicker_mask').datetimepicker({
timepicker:false,
mask:true, // '9999/19/39 29:59' - digit is the maximum possible for a cell
});</code></pre>
@ -273,7 +273,7 @@ jQuery('#_datetimepicker_mask').datetimepicker({
<h4>Set options runtime DateTimePicker <a href="#runtime_options">#</a></h4>
<p>If select day is Saturday, the minimum set 11:00, otherwise 8:00</p>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">var logic = function( currentDateTime ){
<pre><code class="language-javascript">var logic = function( currentDateTime ){
// 'this' is jquery object datetimepicker
if( currentDateTime.getDay()==6 ){
this.setOptions({
@ -312,7 +312,7 @@ jQuery('#_datetimepicker_runtime').datetimepicker({
<h4>After generating a calendar called the event onGenerate <a href="#ongenerate">#</a></h4>
<p>Invert settings minDate and maxDate</p>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">jQuery('#datetimepicker8').datetimepicker({
<pre><code class="language-javascript">jQuery('#datetimepicker8').datetimepicker({
onGenerate:function( ct ){
jQuery(this).find('.xdsoft_date')
.toggleClass('xdsoft_disabled');
@ -339,7 +339,7 @@ jQuery('#_datetimepicker_ongenerate').datetimepicker({
<hr id="weekends_disable" />
<h4>disable all weekend <a href="#weekends_disable">#</a></h4>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">jQuery('#datetimepicker9').datetimepicker({
<pre><code class="language-javascript">jQuery('#datetimepicker9').datetimepicker({
onGenerate:function( ct ){
jQuery(this).find('.xdsoft_date.xdsoft_weekend')
.addClass('xdsoft_disabled');
@ -364,7 +364,7 @@ jQuery('#_datetimepicker_weekends_disable').datetimepicker({
<hr id="use_other_date_parser" />
<h4>Use another date parser/formatter<a href="#use_other_date_parser">#</a></h4>
<p>By default, datetimepicker uses <a href="https://github.com/kartik-v/php-date-formatter">php-date-formatter</a> for parsing and formatting the date and time displayed. You can replace the library by setting a custom DateFormatter. Simply supply an object that implements the <tt>parseDate</tt> and <tt>formatDate</tt> methods. This example uses the popular <a href="http://momentjs.com/">MomentJS</a> library:</p>
<pre><code data-language="javascript">$.datetimepicker.setDateFormatter({
<pre><code class="language-javascript">$.datetimepicker.setDateFormatter({
parseDate: function (date, format) {
var d = moment(date, format);
return d.isValid() ? d.toDate() : false;
@ -376,7 +376,7 @@ jQuery('#_datetimepicker_weekends_disable').datetimepicker({
});
</code></pre>
<p>After this, you can init datetimepicker with moment.js <a href="http://momentjs.com/docs/#/parsing/string-format/" target="_blanc" rel="nofollow">format</a></p>
<pre><code data-language="javascript">jQuery('#datetimepicker').datetimepicker({
<pre><code class="language-javascript">jQuery('#datetimepicker').datetimepicker({
format:'DD.MM.YYYY h:mm a',
formatTime:'h:mm a',
formatDate:'DD.MM.YYYY'
@ -384,7 +384,7 @@ jQuery('#_datetimepicker_weekends_disable').datetimepicker({
<hr id="range" />
<h4>Range between date<a href="#range">#</a></h4>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">jQuery(function(){
<pre><code class="language-javascript">jQuery(function(){
jQuery('#date_timepicker_start').datetimepicker({
format:'Y/m/d',
onShow:function( ct ){
@ -447,7 +447,7 @@ jQuery(function(){
<td>null</td>
<td>Current value datetimepicker. If it is set, ignored input.value</td>
<td>
<pre><code data-language="javascript">{value:'12.03.2013',
<pre><code class="language-javascript">{value:'12.03.2013',
format:'d.m.Y'}</code></pre>
</td>
</tr>
@ -512,7 +512,7 @@ jQuery(function(){
</td>
<td>
<pre><code data-language="javascript">$.datetimepicker.setLocale('ru');</code></pre>
<pre><code class="language-javascript">$.datetimepicker.setLocale('ru');</code></pre>
</td>
</tr>
<tr id="format">
@ -520,7 +520,7 @@ jQuery(function(){
<td>Y/m/d H:i</td>
<td>Format datetime. <a href="http://php.net/manual/ru/function.date.php" target="_blank">More</a> Also there is a special type of <a href="#unixtime"><em>«unixtime»</em></a></td>
<td>
<pre><code data-language="javascript">{format:'H'}
<pre><code class="language-javascript">{format:'H'}
{format:'Y'}{format:'unixtime'}</code></pre>
</td>
</tr>
@ -529,7 +529,7 @@ jQuery(function(){
<td>Y/m/d</td>
<td>Format date for minDate and maxDate</td>
<td>
<pre><code data-language="javascript">{formatDate:'d.m.Y'}</code></pre>
<pre><code class="language-javascript">{formatDate:'d.m.Y'}</code></pre>
</td>
</tr>
<tr id="formatTime">
@ -537,7 +537,7 @@ jQuery(function(){
<td>H:i</td>
<td> Similarly, formatDate . But for minTime and maxTime</td>
<td>
<pre><code data-language="javascript">{formatTime:'H'}</code></pre>
<pre><code class="language-javascript">{formatTime:'H'}</code></pre>
</td>
</tr>
<tr id="step">
@ -545,7 +545,7 @@ jQuery(function(){
<td>60</td>
<td>Step time</td>
<td>
<pre><code data-language="javascript">{step:5}</code></pre>
<pre><code class="language-javascript">{step:5}</code></pre>
</td>
</tr>
<tr id="closeOnDateSelect">
@ -553,7 +553,7 @@ jQuery(function(){
<td>0</td>
<td> </td>
<td>
<pre><code data-language="javascript">{closeOnDateSelect:true}</code></pre>
<pre><code class="language-javascript">{closeOnDateSelect:true}</code></pre>
</td>
</tr>
<tr id="closeOnWithoutClick">
@ -561,7 +561,7 @@ jQuery(function(){
<td>true</td>
<td> </td>
<td>
<pre><code data-language="javascript">{ closeOnWithoutClick :false}</code></pre>
<pre><code class="language-javascript">{ closeOnWithoutClick :false}</code></pre>
</td>
</tr>
<tr id="validateOnBlur">
@ -569,7 +569,7 @@ jQuery(function(){
<td>true</td>
<td>Verify datetime value from input, when losing focus. If value is not valid datetime, then to value inserts the current datetime</td>
<td>
<pre><code data-language="javascript">{ validateOnBlur:false}</code></pre>
<pre><code class="language-javascript">{ validateOnBlur:false}</code></pre>
</td>
</tr>
<tr id="timepicker">
@ -577,7 +577,7 @@ jQuery(function(){
<td>true</td>
<td> </td>
<td>
<pre><code data-language="javascript">{timepicker:false}</code></pre>
<pre><code class="language-javascript">{timepicker:false}</code></pre>
</td>
</tr>
<tr id="datepicker">
@ -585,7 +585,7 @@ jQuery(function(){
<td>true</td>
<td> </td>
<td>
<pre><code data-language="javascript">{datepicker:false}</code></pre>
<pre><code class="language-javascript">{datepicker:false}</code></pre>
</td>
</tr>
<tr id="weeks">
@ -593,7 +593,7 @@ jQuery(function(){
<td>false</td>
<td>Show week number</td>
<td>
<pre><code data-language="javascript">{weeks:true}</code></pre>
<pre><code class="language-javascript">{weeks:true}</code></pre>
</td>
</tr>
<tr id="theme">
@ -601,7 +601,7 @@ jQuery(function(){
<td>'default'</td>
<td>Setting a color scheme. Now only supported default and dark theme</td>
<td>
<pre><code data-language="javascript">{theme:'dark'}</code></pre>
<pre><code class="language-javascript">{theme:'dark'}</code></pre>
</td>
</tr>
<tr id="minDate">
@ -609,7 +609,7 @@ jQuery(function(){
<td>false</td>
<td> </td>
<td>
<pre><code data-language="javascript">{minDate:0} // today
<pre><code class="language-javascript">{minDate:0} // today
{minDate:'2013/12/03'}
{minDate:'-1970/01/02'} // yesterday
{minDate:'05.12.2013',formatDate:'d.m.Y'}</code></pre>
@ -620,7 +620,7 @@ jQuery(function(){
<td>false</td>
<td> </td>
<td>
<pre><code data-language="javascript">{maxDate:0}
<pre><code class="language-javascript">{maxDate:0}
{maxDate:'2013/12/03'}
{maxDate:'+1970/01/02'} // tomorrow
{maxDate:'05.12.2013',formatDate:'d.m.Y'}</code></pre>
@ -631,7 +631,7 @@ jQuery(function(){
<td>false</td>
<td>calendar set date use starDate</td>
<td>
<pre><code data-language="javascript">{startDate:'1987/12/03'}
<pre><code class="language-javascript">{startDate:'1987/12/03'}
{startDate:new Date()}
{startDate:'+1970/01/02'} // tomorrow
{startDate:'08.12.1986',formatDate:'d.m.Y'}</code></pre>
@ -643,7 +643,7 @@ jQuery(function(){
<td>false</td>
<td>if input value is empty, calendar set date use defaultDate</td>
<td>
<pre><code data-language="javascript">{defaultDate:'1987/12/03'}
<pre><code class="language-javascript">{defaultDate:'1987/12/03'}
{defaultDate:new Date()}
{defaultDate:'+1970/01/02'} // tomorrow
{defaultDate:'08.12.1986',formatDate:'d.m.Y'}</code></pre>
@ -655,7 +655,7 @@ jQuery(function(){
<td>false</td>
<td>if input value is empty, timepicker set time use defaultTime</td>
<td>
<pre><code data-language="javascript">{defaultTime:'05:00'}
<pre><code class="language-javascript">{defaultTime:'05:00'}
{defaultTime:'33-12',formatTime:'i-H'}</code></pre>
</td>
</tr>
@ -665,7 +665,7 @@ jQuery(function(){
<td>false</td>
<td> </td>
<td>
<pre><code data-language="javascript">{minTime:0,}// now
<pre><code class="language-javascript">{minTime:0,}// now
{minTime:new Date()}
{minTime:'12:00'}
{minTime:'13:45:34',formatTime:'H:i:s'}</code></pre>
@ -676,7 +676,7 @@ jQuery(function(){
<td>false</td>
<td> </td>
<td>
<pre><code data-language="javascript">{maxTime:0,}
<pre><code class="language-javascript">{maxTime:0,}
{maxTime:'12:00'}
{maxTime:'13:45:34',formatTime:'H:i:s'}</code></pre>
</td>
@ -686,7 +686,7 @@ jQuery(function(){
<td>[]</td>
<td> </td>
<td>
<pre><code data-language="javascript">{allowTimes:[
<pre><code class="language-javascript">{allowTimes:[
'09:00',
'11:00',
'12:00',
@ -752,7 +752,7 @@ jQuery(function(){
<td>function(){}</td>
<td> </td>
<td>
<pre><code data-language="javascript">onSelectDate:function(ct,$i){
<pre><code class="language-javascript">onSelectDate:function(ct,$i){
alert(ct.dateFormat('d/m/Y'))
}</code></pre>
</td>
@ -791,7 +791,7 @@ jQuery(function(){
<td><a href="#onClose">onClose</a></td>
<td>function(current_time,$input){}</td>
<td> </td>
<td><pre><code data-language="javascript">onSelectDate:function(ct,$i){
<td><pre><code class="language-javascript">onSelectDate:function(ct,$i){
$i.datetimepicker('destroy');
}</code></pre></td>
</tr>
@ -854,7 +854,7 @@ jQuery(function(){
<td>round</td>
<td>Round time in timepicker, possible values: round, ceil, floor</td>
<td>
<pre><code data-language="javascript">{roundTime:'floor'}</code></pre>
<pre><code class="language-javascript">{roundTime:'floor'}</code></pre>
</td>
</tr>
<tr id="dayOfWeekStart">
@ -877,7 +877,7 @@ jQuery(function(){
<td>[]</td>
<td> </td>
<td>
<pre><code data-language="javascript">['01.01.2014','02.01.2014','03.01.2014','04.01.2014','05.01.2014','06.01.2014']</code></pre>
<pre><code class="language-javascript">['01.01.2014','02.01.2014','03.01.2014','04.01.2014','05.01.2014','06.01.2014']</code></pre>
</td>
</tr>
<tr id="disabledDates">
@ -885,7 +885,7 @@ jQuery(function(){
<td>[]</td>
<td><p>Disbale all dates in list</p></td>
<td>
<pre><code data-language="javascript">{disabledDates: ['01.01.2014','02.01.2014','03.01.2014','04.01.2014','05.01.2014','06.01.2014'], formatDate:'d.m.Y'}</code></pre>
<pre><code class="language-javascript">{disabledDates: ['01.01.2014','02.01.2014','03.01.2014','04.01.2014','05.01.2014','06.01.2014'], formatDate:'d.m.Y'}</code></pre>
</td>
</tr>
<tr id="allowDates">
@ -893,7 +893,7 @@ jQuery(function(){
<td>[]</td>
<td><p>Allow all dates in list</p></td>
<td>
<pre><code data-language="javascript">{allowDates: ['01.01.2014','02.01.2014','03.01.2014','04.01.2014','05.01.2014','06.01.2014'], formatDate:'d.m.Y'}</code></pre>
<pre><code class="language-javascript">{allowDates: ['01.01.2014','02.01.2014','03.01.2014','04.01.2014','05.01.2014','06.01.2014'], formatDate:'d.m.Y'}</code></pre>
</td>
</tr>
<tr id="allowDateRe">
@ -901,7 +901,7 @@ jQuery(function(){
<td>[]</td>
<td><p>Use Regex to check dates</p></td>
<td>
<pre><code data-language="javascript">{format:'Y-m-d',allowDateRe:'\d{4}-(03-31|06-30|09-30|12-31)' }</code></pre>
<pre><code class="language-javascript">{format:'Y-m-d',allowDateRe:'\d{4}-(03-31|06-30|09-30|12-31)' }</code></pre>
</td>
</tr>
<tr id="disabledWeekDays">
@ -909,7 +909,7 @@ jQuery(function(){
<td>[]</td>
<td><p>Disable days listed by index</p></td>
<td>
<pre><code data-language="javascript">[0, 3, 4]</code></pre>
<pre><code class="language-javascript">[0, 3, 4]</code></pre>
</td>
</tr>
<tr id="id">
@ -924,36 +924,48 @@ jQuery(function(){
<td> </td>
<td> </td>
</tr>
<tr id="ownerDocument">
<td>ownerDocument</td>
<td>document</td>
<td>The ownerDocument object for the datetimepicker to properly attach events and calc position (iframe support).</td>
<td> </td>
</tr>
<tr id="contentWindow">
<td>contentWindow</td>
<td>window</td>
<td>The contentWindow object that contains the datetimepicker to properly attach events (iframe support).</td>
<td> </td>
</tr>
</tbody>
</table>
<hr>
<h2 id="methods">Methods</h2>
<h3>show</h3>
<p>Show Datetimepicker</p>
<pre><code data-language="javascript">$('#input').datetimepicker();
<pre><code class="language-javascript">$('#input').datetimepicker();
$('button.somebutton').on('click', function () {
$('#input').datetimepicker('show');
});</code></pre>
<h3>hide</h3>
<p>Hide Datetimepicker</p>
<pre><code data-language="javascript">$('#input').datetimepicker();
<pre><code class="language-javascript">$('#input').datetimepicker();
$(window).on('resize', function () {
$('#input').datetimepicker('hide');
});</code></pre>
<h3>toggle</h3>
<p>Sgow/Hide Datetimepicker</p>
<pre><code data-language="javascript">$('#input').datetimepicker();
<pre><code class="language-javascript">$('#input').datetimepicker();
$('button.trigger').on('click', function () {
$('#input').datetimepicker('toggle');
});</code></pre>
<h3>destroy</h3>
<p>Destroy datetimepicker</p>
<pre><code data-language="javascript">$('#input').datetimepicker();
<pre><code class="language-javascript">$('#input').datetimepicker();
$('#input').datetimepicker('destroy');
</code></pre>
<h3>reset</h3>
<p>Reset datetimepicker's value</p>
<pre><code data-language="javascript">$('#input').datetimepicker();
<pre><code class="language-javascript">$('#input').datetimepicker();
$('#input').val('12/01/2006');
$('#input')
.datetimepicker('show')
@ -961,19 +973,19 @@ $('#input')
</code></pre>
<h3>validate</h3>
<p>Validate datetimepicker's value </p>
<pre><code data-language="javascript">$('#input').datetimepicker();
<pre><code class="language-javascript">$('#input').datetimepicker();
$('#input').datetimepicker(validate)
</code></pre>
<h3>setOptions</h3>
<p>Set datetimepicker's options </p>
<pre><code data-language="javascript">$('#input').datetimepicker({format: 'd.m.Y'});
<pre><code class="language-javascript">$('#input').datetimepicker({format: 'd.m.Y'});
$('#input').datetimepicker('setOptions', {format: 'd/m/Y'});
//or
$('#input').datetimepicker({format: 'd/m/Y'});
</code></pre>
<h3>getValue</h3>
<p>Get current datetimepicker's value (Date object) </p>
<pre><code data-language="javascript">$('#input').datetimepicker();
<pre><code class="language-javascript">$('#input').datetimepicker();
$('button.somebutton').on('click', function () {
var d = $('#input').datetimepicker('getValue');
console.log(d.getFullYear());

View File

@ -78,7 +78,9 @@
<input type="text" id="datetimepicker_format" class="input input-wide"/>
</body>
<script src="./jquery.js"></script>
<script src="build/jquery.datetimepicker.full.js"></script>
<script src="node_modules/php-date-formatter/js/php-date-formatter.min.js"></script>
<script src="node_modules/jquery-mousewheel/jquery.mousewheel.js"></script>
<script src="jquery.datetimepicker.js"></script>
<script>/*
window.onerror = function(errorMsg) {
$('#console').html($('#console').html()+'<br>'+errorMsg)

View File

@ -102,7 +102,7 @@
margin-bottom: 3px
}
.xdsoft_datetimepicker .xdsoft_mounthpicker {
.xdsoft_datetimepicker .xdsoft_monthpicker {
position: relative;
text-align: center;
}

378
jquery.datetimepicker.js Executable file → Normal file
View File

@ -1,22 +1,15 @@
/**
* @preserve jQuery DateTimePicker plugin v2.5.3
* @preserve jQuery DateTimePicker
* @homepage http://xdsoft.net/jqplugins/datetimepicker/
* @author Chupurnov Valeriy (<chupurnov@gmail.com>)
*/
/*global DateFormatter, document,window,jQuery,setTimeout,clearTimeout,HighlightedDate,getCurrentValue*/
;(function (factory) {
if ( typeof define === 'function' && define.amd ) {
// AMD. Register as an anonymous module.
define(['jquery', 'jquery-mousewheel'], factory);
} else if (typeof exports === 'object') {
// Node/CommonJS style for Browserify
module.exports = factory;
} else {
// Browser globals
factory(jQuery);
}
}(function ($) {
/**
* @param {jQuery} $
*/
var datetimepickerFactory = function ($) {
'use strict';
var default_options = {
i18n: {
ar: { // Arabic
@ -197,6 +190,13 @@
"Sön", "Mån", "Tis", "Ons", "Tor", "Fre", "Lör"
]
},
km: { // Khmer (ភាសាខ្មែរ)
months: [
"មករា​", "កុម្ភៈ", "មិនា​", "មេសា​", "ឧសភា​", "មិថុនា​", "កក្កដា​", "សីហា​", "កញ្ញា​", "តុលា​", "វិច្ឆិកា", "ធ្នូ​"
],
dayOfWeekShort: ["អាទិ​", "ច័ន្ទ​", "អង្គារ​", "ពុធ​", "ព្រហ​​", "សុក្រ​", "សៅរ៍"],
dayOfWeek: ["អាទិត្យ​", "ច័ន្ទ​", "អង្គារ​", "ពុធ​", "ព្រហស្បតិ៍​", "សុក្រ​", "សៅរ៍"]
},
kr: { // Korean
months: [
"1월", "2월", "3월", "4월", "5월", "6월", "7월", "8월", "9월", "10월", "11월", "12월"
@ -217,7 +217,7 @@
},
da: { // Dansk
months: [
"January", "Februar", "Marts", "April", "Maj", "Juni", "July", "August", "September", "Oktober", "November", "December"
"Januar", "Februar", "Marts", "April", "Maj", "Juni", "Juli", "August", "September", "Oktober", "November", "December"
],
dayOfWeekShort: [
"Søn", "Man", "Tir", "Ons", "Tor", "Fre", "Lør"
@ -475,6 +475,14 @@
],
dayOfWeek: ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"]
},
ug:{ // Uyghur(ئۇيغۇرچە)
months: [
"1-ئاي","2-ئاي","3-ئاي","4-ئاي","5-ئاي","6-ئاي","7-ئاي","8-ئاي","9-ئاي","10-ئاي","11-ئاي","12-ئاي"
],
dayOfWeek: [
"يەكشەنبە", "دۈشەنبە","سەيشەنبە","چارشەنبە","پەيشەنبە","جۈمە","شەنبە"
]
},
he: { //Hebrew (עברית)
months: [
'ינואר', 'פברואר', 'מרץ', 'אפריל', 'מאי', 'יוני', 'יולי', 'אוגוסט', 'ספטמבר', 'אוקטובר', 'נובמבר', 'דצמבר'
@ -523,8 +531,12 @@
"კვ", "ორშ", "სამშ", "ოთხ", "ხუთ", "პარ", "შაბ"
],
dayOfWeek: ["კვირა", "ორშაბათი", "სამშაბათი", "ოთხშაბათი", "ხუთშაბათი", "პარასკევი", "შაბათი"]
}
},
},
ownerDocument: document,
contentWindow: window,
value: '',
rtl: false,
@ -540,6 +552,7 @@
closeOnTimeSelect: true,
closeOnWithoutClick: true,
closeOnInputClick: true,
openOnFocus: true,
timepicker: true,
datepicker: true,
@ -552,6 +565,8 @@
maxDate: false,
minTime: false,
maxTime: false,
minDateTime: false,
disabledMinTime: false,
disabledMaxTime: false,
@ -560,6 +575,7 @@
initTime: true,
inline: false,
theme: '',
touchMovedThreshold: 5,
onSelectDate: function () {},
onSelectTime: function () {},
@ -630,27 +646,31 @@
days: locale.dayOfWeek,
daysShort: locale.dayOfWeekShort,
months: locale.months,
monthsShort: $.map(locale.months, function(n){ return n.substring(0, 3) }),
monthsShort: $.map(locale.months, function(n){ return n.substring(0, 3) })
};
if (typeof DateFormatter === 'function') {
dateHelper = new DateFormatter({
dateSettings: $.extend({}, dateFormatterOptionsDefault, opts)
});
}
};
// for locale settings
$.datetimepicker = {
setLocale: function(locale){
var newLocale = default_options.i18n[locale] ? locale : globalLocaleDefault;
if(globalLocale != newLocale){
if (globalLocale !== newLocale) {
globalLocale = newLocale;
// reinit date formatter
initDateFormatter();
}
},
setDateFormatter: function(dateFormatter) {
dateHelper = dateFormatter;
},
RFC_2822: 'D, d M Y H:i:s O',
ATOM: 'Y-m-d\TH:i:sP',
ISO_8601: 'Y-m-d\TH:i:sO',
@ -667,10 +687,10 @@
// fix for ie8
if (!window.getComputedStyle) {
window.getComputedStyle = function (el, pseudo) {
window.getComputedStyle = function (el) {
this.el = el;
this.getPropertyValue = function (prop) {
var re = /(\-([a-z]){1})/g;
var re = /(-([a-z]))/g;
if (prop === 'float') {
prop = 'styleFloat';
}
@ -693,10 +713,12 @@
return -1;
};
}
Date.prototype.countDaysInMonth = function () {
return new Date(this.getFullYear(), this.getMonth() + 1, 0).getDate();
};
$.fn.xdsoftScroller = function (percent) {
$.fn.xdsoftScroller = function (options, percent) {
return this.each(function () {
var timeboxparent = $(this),
pointerEventToXY = function (e) {
@ -725,10 +747,12 @@
touchStart = false,
startTopScroll = 0,
calcOffset = function () {};
if (percent === 'hide') {
timeboxparent.find('.xdsoft_scrollbar').hide();
return;
}
if (!$(this).hasClass('xdsoft_scroller_box')) {
timebox = timeboxparent.children().eq(0);
parentHeight = timeboxparent[0].clientHeight;
@ -760,15 +784,15 @@
h1 = scrollbar[0].offsetHeight;
if (event.type === 'mousedown' || event.type === 'touchstart') {
if (document) {
$(document.body).addClass('xdsoft_noselect');
if (options.ownerDocument) {
$(options.ownerDocument.body).addClass('xdsoft_noselect');
}
$([document.body, window]).on('touchend mouseup.xdsoft_scroller', function arguments_callee() {
$([document.body, window]).off('touchend mouseup.xdsoft_scroller', arguments_callee)
$([options.ownerDocument.body, options.contentWindow]).on('touchend mouseup.xdsoft_scroller', function arguments_callee() {
$([options.ownerDocument.body, options.contentWindow]).off('touchend mouseup.xdsoft_scroller', arguments_callee)
.off('mousemove.xdsoft_scroller', calcOffset)
.removeClass('xdsoft_noselect');
});
$(document.body).on('mousemove.xdsoft_scroller', calcOffset);
$(options.ownerDocument.body).on('mousemove.xdsoft_scroller', calcOffset);
} else {
touchStart = true;
event.stopPropagation();
@ -904,7 +928,7 @@
var datetimepicker = $('<div class="xdsoft_datetimepicker xdsoft_noselect"></div>'),
xdsoft_copyright = $('<div class="xdsoft_copyright"><a target="_blank" href="http://xdsoft.net/jqplugins/datetimepicker/">xdsoft.net</a></div>'),
datepicker = $('<div class="xdsoft_datepicker active"></div>'),
mounth_picker = $('<div class="xdsoft_mounthpicker"><button type="button" class="xdsoft_prev"></button><button type="button" class="xdsoft_today_button"></button>' +
month_picker = $('<div class="xdsoft_monthpicker"><button type="button" class="xdsoft_prev"></button><button type="button" class="xdsoft_today_button"></button>' +
'<div class="xdsoft_label xdsoft_month"><span></span><i></i></div>' +
'<div class="xdsoft_label xdsoft_year"><span></span><i></i></div>' +
'<button type="button" class="xdsoft_next"></button></div>'),
@ -943,14 +967,14 @@
datetimepicker.addClass('xdsoft_' + options.theme);
datetimepicker.addClass(options.className);
mounth_picker
month_picker
.find('.xdsoft_month span')
.after(monthselect);
mounth_picker
month_picker
.find('.xdsoft_year span')
.after(yearselect);
mounth_picker
month_picker
.find('.xdsoft_month,.xdsoft_year')
.on('touchstart mousedown.xdsoft', function (event) {
var select = $(this).find('.xdsoft_select').eq(0),
@ -960,7 +984,7 @@
items,
i;
mounth_picker
month_picker
.find('.xdsoft_select')
.hide();
if (_xdsoft_datetime.currentTime) {
@ -976,19 +1000,34 @@
}
}
select.xdsoftScroller(top / (select.children()[0].offsetHeight - (select[0].clientHeight)));
select.xdsoftScroller(options, top / (select.children()[0].offsetHeight - (select[0].clientHeight)));
event.stopPropagation();
return false;
});
mounth_picker
var handleTouchMoved = function (event) {
this.touchStartPosition = this.touchStartPosition || event.originalEvent.touches[0]
var touchPosition = event.originalEvent.touches[0]
var xMovement = Math.abs(this.touchStartPosition.clientX - touchPosition.clientX)
var yMovement = Math.abs(this.touchStartPosition.clientY - touchPosition.clientY)
var distance = Math.sqrt(xMovement * xMovement + yMovement * yMovement)
if(distance > options.touchMovedThreshold) {
this.touchMoved = true;
}
}
month_picker
.find('.xdsoft_select')
.xdsoftScroller()
.xdsoftScroller(options)
.on('touchstart mousedown.xdsoft', function (event) {
this.touchMoved = false;
this.touchStartPosition = event.originalEvent.touches[0]
event.stopPropagation();
event.preventDefault();
})
.on('touchstart mousedown.xdsoft', '.xdsoft_option', function () {
.on('touchmove', '.xdsoft_option', handleTouchMoved)
.on('touchend mousedown.xdsoft', '.xdsoft_option', function () {
if (!this.touchMoved) {
if (_xdsoft_datetime.currentTime === undefined || _xdsoft_datetime.currentTime === null) {
_xdsoft_datetime.currentTime = _xdsoft_datetime.now();
}
@ -1008,6 +1047,7 @@
if (year !== _xdsoft_datetime.currentTime.getFullYear() && $.isFunction(options.onChangeYear)) {
options.onChangeYear.call(datetimepicker, _xdsoft_datetime.currentTime, datetimepicker.data('input'));
}
}
});
datetimepicker.getValue = function () {
@ -1145,7 +1185,7 @@
}
if (!options.timepickerScrollbar) {
timeboxparent.xdsoftScroller('hide');
timeboxparent.xdsoftScroller(options, 'hide');
}
if (options.minDate && /^[\+\-](.*)$/.test(options.minDate)) {
@ -1156,17 +1196,21 @@
options.maxDate = dateHelper.formatDate(_xdsoft_datetime.strToDateTime(options.maxDate), options.formatDate);
}
if (options.minDateTime && /^\+(.*)$/.test(options.minDateTime)) {
options.minDateTime = _xdsoft_datetime.strToDateTime(options.minDateTime).dateFormat(options.formatDate);
}
applyButton.toggle(options.showApplyButton);
mounth_picker
month_picker
.find('.xdsoft_today_button')
.css('visibility', !options.todayButton ? 'hidden' : 'visible');
mounth_picker
month_picker
.find('.' + options.prev)
.css('visibility', !options.prevButton ? 'hidden' : 'visible');
mounth_picker
month_picker
.find('.' + options.next)
.css('visibility', !options.nextButton ? 'hidden' : 'visible');
@ -1176,7 +1220,8 @@
input
.off('blur.xdsoft')
.on('blur.xdsoft', function () {
if (options.allowBlank && (!$.trim($(this).val()).length || (typeof options.mask == "string" && $.trim($(this).val()) === options.mask.replace(/[0-9]/g, '_')))) {
if (options.allowBlank && (!$.trim($(this).val()).length ||
(typeof options.mask === "string" && $.trim($(this).val()) === options.mask.replace(/[0-9]/g, '_')))) {
$(this).val(null);
datetimepicker.data('xdsoft_datetime').empty();
} else {
@ -1222,10 +1267,10 @@
//scroll_element = timepicker.find('.xdsoft_time_box');
timeboxparent.append(timebox);
timeboxparent.xdsoftScroller();
timeboxparent.xdsoftScroller(options);
datetimepicker.on('afterOpen.xdsoft', function () {
timeboxparent.xdsoftScroller();
timeboxparent.xdsoftScroller(options);
});
datetimepicker
@ -1238,7 +1283,7 @@
}
datepicker
.append(mounth_picker)
.append(month_picker)
.append(calendar)
.append(applyButton);
@ -1267,6 +1312,8 @@
time = _this.strtotime(options.defaultTime);
d.setHours(time.getHours());
d.setMinutes(time.getMinutes());
d.setSeconds(time.getSeconds());
d.setMilliseconds(time.getMilliseconds());
}
return d;
};
@ -1285,7 +1332,7 @@
else if (_this.isValidDate(dTime)) {
_this.currentTime = dTime;
}
else if (!dTime && !requireValidDate && options.allowBlank) {
else if (!dTime && !requireValidDate && options.allowBlank && !options.inline) {
_this.currentTime = null;
}
else {
@ -1299,7 +1346,7 @@
_this.currentTime = null;
};
_this.getCurrentTime = function (dTime) {
_this.getCurrentTime = function () {
return _this.currentTime;
};
@ -1371,9 +1418,12 @@
}
}
var onejan = new Date(datetime.getFullYear(), 0, 1);
//First week of the year is th one with the first Thursday according to ISO8601
if(onejan.getDay()!=4)
if (onejan.getDay() !== 4) {
onejan.setMonth(0, 1 + ((4 - onejan.getDay()+ 7) % 7));
}
return Math.ceil((((datetime - onejan) / 86400000) + onejan.getDay() + 1) / 7);
};
@ -1384,10 +1434,12 @@
return sDateTime;
}
tmpDate = /^(\+|\-)(.*)$/.exec(sDateTime);
tmpDate = /^([+-]{1})(.*)$/.exec(sDateTime);
if (tmpDate) {
tmpDate[2] = dateHelper.parseDate(tmpDate[2], options.formatDate);
}
if (tmpDate && tmpDate[2]) {
timeOffset = tmpDate[2].getTime() - (tmpDate[2].getTimezoneOffset()) * 60000;
currentTime = new Date((_this.now(true)).getTime() + parseInt(tmpDate[1] + '1', 10) * timeOffset);
@ -1440,7 +1492,7 @@
input.val(_xdsoft_datetime.str());
datetimepicker.trigger('close.xdsoft');
});
mounth_picker
month_picker
.find('.xdsoft_today_button')
.on('touchend mousedown.xdsoft', function () {
datetimepicker.data('changed', true);
@ -1463,7 +1515,7 @@
input.trigger('change');
datetimepicker.trigger('close.xdsoft');
});
mounth_picker
month_picker
.find('.xdsoft_prev,.xdsoft_next')
.on('touchend mousedown.xdsoft', function () {
var $this = $(this),
@ -1483,10 +1535,10 @@
}
}(500));
$([document.body, window]).on('touchend mouseup.xdsoft', function arguments_callee2() {
$([options.ownerDocument.body, options.contentWindow]).on('touchend mouseup.xdsoft', function arguments_callee2() {
clearTimeout(timer);
stop = true;
$([document.body, window]).off('touchend mouseup.xdsoft', arguments_callee2);
$([options.ownerDocument.body, options.contentWindow]).off('touchend mouseup.xdsoft', arguments_callee2);
});
});
@ -1525,10 +1577,10 @@
timer = setTimeout(arguments_callee4, v || period);
}
}(500));
$([document.body, window]).on('touchend mouseup.xdsoft', function arguments_callee5() {
$([options.ownerDocument.body, options.contentWindow]).on('touchend mouseup.xdsoft', function arguments_callee5() {
clearTimeout(timer);
stop = true;
$([document.body, window])
$([options.ownerDocument.body, options.contentWindow])
.off('touchend mouseup.xdsoft', arguments_callee5);
});
});
@ -1541,10 +1593,6 @@
xchangeTimer = setTimeout(function () {
if (_xdsoft_datetime.currentTime === undefined || _xdsoft_datetime.currentTime === null) {
//In case blanks are allowed, delay construction until we have a valid date
if (options.allowBlank)
return;
_xdsoft_datetime.currentTime = _xdsoft_datetime.now();
}
@ -1555,6 +1603,7 @@
today = _xdsoft_datetime.now(),
maxDate = false,
minDate = false,
minDateTime = false,
hDate,
day,
d,
@ -1565,7 +1614,7 @@
customDateSettings,
newRow = true,
time = '',
h = '',
h,
line_time,
description;
@ -1596,6 +1645,11 @@
minDate = new Date(minDate.getFullYear(), minDate.getMonth(), minDate.getDate());
}
if (options.minDateTime !== false) {
minDateTime = _xdsoft_datetime.strToDate(options.minDateTime);
minDateTime = new Date(minDateTime.getFullYear(), minDateTime.getMonth(), minDateTime.getDate(), minDateTime.getHours(), minDateTime.getMinutes(), minDateTime.getSeconds());
}
while (i < _xdsoft_datetime.currentTime.countDaysInMonth() || start.getDay() !== options.dayOfWeekStart || _xdsoft_datetime.currentTime.getMonth() === start.getMonth()) {
classes = [];
i += 1;
@ -1619,17 +1673,27 @@
if(!options.allowDateRe.test(dateHelper.formatDate(start, options.formatDate))){
classes.push('xdsoft_disabled');
}
} else if(options.allowDates && options.allowDates.length>0){
}
if(options.allowDates && options.allowDates.length>0){
if(options.allowDates.indexOf(dateHelper.formatDate(start, options.formatDate)) === -1){
classes.push('xdsoft_disabled');
}
} else if ((maxDate !== false && start > maxDate) || (minDate !== false && start < minDate) || (customDateSettings && customDateSettings[0] === false)) {
}
if ((maxDate !== false && start > maxDate) || (minDateTime !== false && start < minDateTime) || (minDate !== false && start < minDate) || (customDateSettings && customDateSettings[0] === false)) {
classes.push('xdsoft_disabled');
} else if (options.disabledDates.indexOf(dateHelper.formatDate(start, options.formatDate)) !== -1) {
}
if (options.disabledDates.indexOf(dateHelper.formatDate(start, options.formatDate)) !== -1) {
classes.push('xdsoft_disabled');
} else if (options.disabledWeekDays.indexOf(day) !== -1) {
}
if (options.disabledWeekDays.indexOf(day) !== -1) {
classes.push('xdsoft_disabled');
}else if (input.is('[readonly]')) {
}
if (input.is('[disabled]')) {
classes.push('xdsoft_disabled');
}
@ -1686,8 +1750,8 @@
calendar.html(table);
mounth_picker.find('.xdsoft_label span').eq(0).text(options.i18n[globalLocale].months[_xdsoft_datetime.currentTime.getMonth()]);
mounth_picker.find('.xdsoft_label span').eq(1).text(_xdsoft_datetime.currentTime.getFullYear());
month_picker.find('.xdsoft_label span').eq(0).text(options.i18n[globalLocale].months[_xdsoft_datetime.currentTime.getMonth()]);
month_picker.find('.xdsoft_label span').eq(1).text(_xdsoft_datetime.currentTime.getFullYear());
// generate timebox
time = '';
@ -1709,7 +1773,7 @@
classes.push('xdsoft_disabled');
} else if ((options.minDateTime !== false && options.minDateTime > optionDateTime) || ((options.disabledMinTime !== false && now.getTime() > _xdsoft_datetime.strtotime(options.disabledMinTime).getTime()) && (options.disabledMaxTime !== false && now.getTime() < _xdsoft_datetime.strtotime(options.disabledMaxTime).getTime()))) {
classes.push('xdsoft_disabled');
} else if (input.is('[readonly]')) {
} else if (input.is('[disabled]')) {
classes.push('xdsoft_disabled');
}
@ -1752,7 +1816,6 @@
timebox.html(time);
opt = '';
i = 0;
for (i = parseInt(options.yearStart, 10) + options.yearOffset; i <= parseInt(options.yearEnd, 10) + options.yearOffset; i += 1) {
opt += '<div class="xdsoft_option ' + (_xdsoft_datetime.currentTime.getFullYear() === i ? 'xdsoft_current' : '') + '" data-value="' + i + '">' + i + '</div>';
@ -1833,7 +1896,12 @@
});
timebox
.on('touchstart', 'div', function (xdevent) {
this.touchMoved = false;
})
.on('touchmove', 'div', handleTouchMoved)
.on('touchend click.xdsoft', 'div', function (xdevent) {
if (!this.touchMoved) {
xdevent.stopPropagation();
var $this = $(this),
currentTime = _xdsoft_datetime.currentTime;
@ -1861,6 +1929,7 @@
if (options.inline !== true && options.closeOnTimeSelect === true) {
datetimepicker.trigger('close.xdsoft');
}
}
});
datepicker
@ -1938,7 +2007,7 @@
do {
node = node.parentNode;
if (callback(node) === false) {
if (!node || callback(node) === false) {
break;
}
} while (node.nodeName !== 'HTML');
@ -1973,11 +2042,11 @@
left = dateInputOffset.left;
position = "absolute";
windowWidth = $(window).width();
windowHeight = $(window).height();
windowScrollTop = $(window).scrollTop();
windowWidth = $(options.contentWindow).width();
windowHeight = $(options.contentWindow).height();
windowScrollTop = $(options.contentWindow).scrollTop();
if ((document.documentElement.clientWidth - dateInputOffset.left) < datepicker.parent().outerWidth(true)) {
if ((options.ownerDocument.documentElement.clientWidth - dateInputOffset.left) < datepicker.parent().outerWidth(true)) {
var diff = datepicker.parent().outerWidth(true) - dateInputElem.offsetWidth;
left = left - diff;
}
@ -1988,13 +2057,17 @@
if (options.fixed) {
verticalPosition -= windowScrollTop;
left -= $(window).scrollLeft();
left -= $(options.contentWindow).scrollLeft();
position = "fixed";
} else {
dateInputHasFixedAncestor = false;
forEachAncestorOf(dateInputElem, function (ancestorNode) {
if (window.getComputedStyle(ancestorNode).getPropertyValue('position') === 'fixed') {
if (ancestorNode === null) {
return false;
}
if (options.contentWindow.getComputedStyle(ancestorNode).getPropertyValue('position') === 'fixed') {
dateInputHasFixedAncestor = true;
return false;
}
@ -2011,8 +2084,8 @@
verticalPosition -= windowScrollTop;
}
} else {
if (verticalPosition + dateInputElem.offsetHeight > windowHeight + windowScrollTop) {
verticalPosition = dateInputOffset.top - dateInputElem.offsetHeight + 1;
if (verticalPosition + datetimepicker[0].offsetHeight > windowHeight + windowScrollTop) {
verticalPosition = dateInputOffset.top - datetimepicker[0].offsetHeight + 1;
}
}
@ -2030,7 +2103,7 @@
forEachAncestorOf(datetimepickerElem, function (ancestorNode) {
var ancestorNodePosition;
ancestorNodePosition = window.getComputedStyle(ancestorNode).getPropertyValue('position');
ancestorNodePosition = options.contentWindow.getComputedStyle(ancestorNode).getPropertyValue('position');
if (ancestorNodePosition === 'relative' && windowWidth >= ancestorNode.offsetWidth) {
left = left - ((windowWidth - ancestorNode.offsetWidth) / 2);
@ -2059,21 +2132,21 @@
if (onShow !== false) {
datetimepicker.show();
setPos();
$(window)
$(options.contentWindow)
.off('resize.xdsoft', setPos)
.on('resize.xdsoft', setPos);
if (options.closeOnWithoutClick) {
$([document.body, window]).on('touchstart mousedown.xdsoft', function arguments_callee6() {
$([options.ownerDocument.body, options.contentWindow]).on('touchstart mousedown.xdsoft', function arguments_callee6() {
datetimepicker.trigger('close.xdsoft');
$([document.body, window]).off('touchstart mousedown.xdsoft', arguments_callee6);
$([options.ownerDocument.body, options.contentWindow]).off('touchstart mousedown.xdsoft', arguments_callee6);
});
}
}
})
.on('close.xdsoft', function (event) {
var onClose = true;
mounth_picker
month_picker
.find('.xdsoft_month,.xdsoft_year')
.find('.xdsoft_select')
.hide();
@ -2140,8 +2213,8 @@
},
getCaretPos = function (input) {
try {
if (document.selection && document.selection.createRange) {
var range = document.selection.createRange();
if (options.ownerDocument.selection && options.ownerDocument.selection.createRange) {
var range = options.ownerDocument.selection.createRange();
return range.getBookmark().charCodeAt(2) - 2;
}
if (input.setSelectionRange) {
@ -2152,7 +2225,7 @@
}
},
setCaretPos = function (node, pos) {
node = (typeof node === "string" || node instanceof String) ? document.getElementById(node) : node;
node = (typeof node === "string" || node instanceof String) ? options.ownerDocument.getElementById(node) : node;
if (!node) {
return false;
}
@ -2170,9 +2243,11 @@
}
return false;
};
if(options.mask) {
input.off('keydown.xdsoft');
}
if (options.mask === true) {
if (typeof moment != 'undefined') {
options.mask = options.format
@ -2201,38 +2276,122 @@
setCaretPos(input[0], 0);
}
input.on('paste.xdsoft', function (event) {
// couple options here
// 1. return false - tell them they can't paste
// 2. insert over current characters - minimal validation
// 3. full fledged parsing and validation
// let's go option 2 for now
// fires multiple times for some reason
// https://stackoverflow.com/a/30496488/1366033
var clipboardData = event.clipboardData || event.originalEvent.clipboardData || window.clipboardData,
pastedData = clipboardData.getData('text'),
val = this.value,
pos = this.selectionStart
var valueBeforeCursor = val.substr(0, pos);
var valueAfterPaste = val.substr(pos + pastedData.length);
val = valueBeforeCursor + pastedData + valueAfterPaste;
pos += pastedData.length;
if (isValidValue(options.mask, val)) {
this.value = val;
setCaretPos(this, pos);
} else if ($.trim(val) === '') {
this.value = options.mask.replace(/[0-9]/g, '_');
} else {
input.trigger('error_input.xdsoft');
}
event.preventDefault();
return false;
});
input.on('keydown.xdsoft', function (event) {
var val = this.value,
key = event.which,
pos,
pos = this.selectionStart,
selEnd = this.selectionEnd,
hasSel = pos !== selEnd,
digit;
if (((key >= KEY0 && key <= KEY9) || (key >= _KEY0 && key <= _KEY9)) || (key === BACKSPACE || key === DEL)) {
pos = getCaretPos(this);
digit = (key !== BACKSPACE && key !== DEL) ? String.fromCharCode((_KEY0 <= key && key <= _KEY9) ? key - KEY0 : key) : '_';
// only alow these characters
if (((key >= KEY0 && key <= KEY9) ||
(key >= _KEY0 && key <= _KEY9)) ||
(key === BACKSPACE || key === DEL)) {
if ((key === BACKSPACE || key === DEL) && pos) {
// get char to insert which is new character or placeholder ('_')
digit = (key === BACKSPACE || key === DEL) ? '_' :
String.fromCharCode((_KEY0 <= key && key <= _KEY9) ? key - KEY0 : key);
// we're deleting something, we're not at the start, and have normal cursor, move back one
// if we have a selection length, cursor actually sits behind deletable char, not in front
if (key === BACKSPACE && pos && !hasSel) {
pos -= 1;
digit = '_';
}
while (/[^0-9_]/.test(options.mask.substr(pos, 1)) && pos < options.mask.length && pos > 0) {
pos += (key === BACKSPACE || key === DEL) ? -1 : 1;
// don't stop on a separator, continue whatever direction you were going
// value char - keep incrementing position while on separator char and we still have room
// del char - keep decrementing position while on separator char and we still have room
while (true) {
var maskValueAtCurPos = options.mask.substr(pos, 1);
var posShorterThanMaskLength = pos < options.mask.length;
var posGreaterThanZero = pos > 0;
var notNumberOrPlaceholder = /[^0-9_]/;
var curPosOnSep = notNumberOrPlaceholder.test(maskValueAtCurPos);
var continueMovingPosition = curPosOnSep && posShorterThanMaskLength && posGreaterThanZero
// if we hit a real char, stay where we are
if (!continueMovingPosition) break;
// hitting backspace in a selection, you can possibly go back any further - go forward
pos += (key === BACKSPACE && !hasSel) ? -1 : 1;
}
val = val.substr(0, pos) + digit + val.substr(pos + 1);
if ($.trim(val) === '') {
val = options.mask.replace(/[0-9]/g, '_');
if (hasSel) {
// pos might have moved so re-calc length
var selLength = selEnd - pos
// if we have a selection length we will wipe out entire selection and replace with default template for that range
var defaultBlank = options.mask.replace(/[0-9]/g, '_');
var defaultBlankSelectionReplacement = defaultBlank.substr(pos, selLength);
var selReplacementRemainder = defaultBlankSelectionReplacement.substr(1) // might be empty
var valueBeforeSel = val.substr(0, pos);
var insertChars = digit + selReplacementRemainder;
var charsAfterSelection = val.substr(pos + selLength);
val = valueBeforeSel + insertChars + charsAfterSelection
} else {
var valueBeforeCursor = val.substr(0, pos);
var insertChar = digit;
var valueAfterNextChar = val.substr(pos + 1);
val = valueBeforeCursor + insertChar + valueAfterNextChar
}
if ($.trim(val) === '') {
// if empty, set to default
val = defaultBlank
} else {
// if at the last character don't need to do anything
if (pos === options.mask.length) {
event.preventDefault();
return false;
}
}
pos += (key === BACKSPACE || key === DEL) ? 0 : 1;
// resume cursor location
pos += (key === BACKSPACE) ? 0 : 1;
// don't stop on a separator, continue whatever direction you were going
while (/[^0-9_]/.test(options.mask.substr(pos, 1)) && pos < options.mask.length && pos > 0) {
pos += (key === BACKSPACE || key === DEL) ? -1 : 1;
pos += (key === BACKSPACE) ? 0 : 1;
}
if (isValidValue(options.mask, val)) {
@ -2263,6 +2422,9 @@
if (input.is(':disabled') || (input.data('xdsoft_datetimepicker').is(':visible') && options.closeOnInputClick)) {
return;
}
if (!options.openOnFocus) {
return;
}
clearTimeout(timer);
timer = setTimeout(function () {
if (input.is(':disabled')) {
@ -2303,14 +2465,14 @@
input
.data('xdsoft_datetimepicker', null)
.off('.xdsoft');
$(window).off('resize.xdsoft');
$([window, document.body]).off('mousedown.xdsoft touchstart');
$(options.contentWindow).off('resize.xdsoft');
$([options.contentWindow, options.ownerDocument.body]).off('mousedown.xdsoft touchstart');
if (input.unmousewheel) {
input.unmousewheel();
}
}
};
$(document)
$(options.ownerDocument)
.off('keydown.xdsoftctrl keyup.xdsoftctrl')
.on('keydown.xdsoftctrl', function (e) {
if (e.keyCode === CTRLKEY) {
@ -2383,4 +2545,18 @@
this.desc = desc;
this.style = style;
}
}));
};
;(function (factory) {
if ( typeof define === 'function' && define.amd ) {
// AMD. Register as an anonymous module.
define(['jquery', 'jquery-mousewheel'], factory);
} else if (typeof exports === 'object') {
// Node/CommonJS style for Browserify
module.exports = factory(require('jquery'));;
} else {
// Browser globals
factory(jQuery);
}
}(datetimepickerFactory));

File diff suppressed because one or more lines are too long

6
jquery.js vendored

File diff suppressed because one or more lines are too long

View File

@ -1,15 +1,16 @@
{
"name": "jquery-datetimepicker",
"version": "2.5.3",
"version": "2.5.16",
"description": "jQuery Plugin DateTimePicker it is DatePicker and TimePicker in one",
"main": "build/jquery.datetimepicker.full.min.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"concat": "concat-cli -f bower_components/php-date-formatter/js/php-date-formatter.js jquery.datetimepicker.js bower_components/jquery-mousewheel/jquery.mousewheel.js -o build/jquery.datetimepicker.full.js",
"concat": "concat-cli -f node_modules/php-date-formatter/js/php-date-formatter.min.js jquery.datetimepicker.js node_modules/jquery-mousewheel/jquery.mousewheel.js -o build/jquery.datetimepicker.full.js",
"minify": "uglifyjs jquery.datetimepicker.js -c -m -o build/jquery.datetimepicker.min.js && uglifycss jquery.datetimepicker.css > build/jquery.datetimepicker.min.css",
"minifyconcat": "uglifyjs build/jquery.datetimepicker.full.js -c -m -o build/jquery.datetimepicker.full.min.js",
"github": "git add --all && git commit -m \"New version %npm_package_version% Fix devDependencies with concat-cli\" && git tag %npm_package_version% && git push --tags origin HEAD:master && npm publish",
"build": "npm run minify && npm run concat && npm run minifyconcat"
"github": "git add --all && git commit -m \"New version %npm_package_version% \" && git tag %npm_package_version% && git push --tags origin HEAD:master && npm publish",
"build": "npm run minify && npm run concat && npm run minifyconcat",
"public": "npm version patch --no-git-tag-version && npm run build && npm run github"
},
"repository": {
"type": "git",
@ -33,12 +34,12 @@
"dependencies": {
"jquery": ">= 1.7.2",
"jquery-mousewheel": ">= 3.1.13",
"php-date-formatter": ">= 1.3.3"
"php-date-formatter": "^1.3.4"
},
"devDependencies": {
"concat": "azer/concat",
"concat-cli": "^4.0.0",
"uglifycss": "0.0.20",
"uglifycss": "^0.0.27",
"uglifyjs": "^2.4.10"
}
}

View File

0
tests/input_in_container_fixed_to_top_of_viewport.html Executable file → Normal file
View File

175
yarn.lock Normal file
View File

@ -0,0 +1,175 @@
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
# yarn lockfile v1
ansi-regex@^2.0.0:
version "2.1.1"
resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-2.1.1.tgz#c3b33ab5ee360d86e0e628f0468ae7ef27d654df"
ansi-styles@^2.2.1:
version "2.2.1"
resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-2.2.1.tgz#b432dd3358b634cf75e1e4664368240533c1ddbe"
camelcase@^2.0.1:
version "2.1.1"
resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-2.1.1.tgz#7c1d16d679a1bbe59ca02cacecfb011e201f5a1f"
chalk@^1.1.1:
version "1.1.3"
resolved "https://registry.yarnpkg.com/chalk/-/chalk-1.1.3.tgz#a8115c55e4a702fe4d150abd3872822a7e09fc98"
dependencies:
ansi-styles "^2.2.1"
escape-string-regexp "^1.0.2"
has-ansi "^2.0.0"
strip-ansi "^3.0.0"
supports-color "^2.0.0"
cliui@^3.0.3:
version "3.2.0"
resolved "https://registry.yarnpkg.com/cliui/-/cliui-3.2.0.tgz#120601537a916d29940f934da3b48d585a39213d"
dependencies:
string-width "^1.0.1"
strip-ansi "^3.0.1"
wrap-ansi "^2.0.0"
code-point-at@^1.0.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/code-point-at/-/code-point-at-1.1.0.tgz#0d070b4d043a5bea33a2f1a40e2edb3d9a4ccf77"
commander@^2.9.0:
version "2.11.0"
resolved "https://registry.yarnpkg.com/commander/-/commander-2.11.0.tgz#157152fd1e7a6c8d98a5b715cf376df928004563"
concat-cli@^4.0.0:
version "4.0.0"
resolved "https://registry.yarnpkg.com/concat-cli/-/concat-cli-4.0.0.tgz#a73a0fb0d18b25804ebe703bcc35922324dbf74d"
dependencies:
chalk "^1.1.1"
concat "^1.0.0"
yargs "^3.30.0"
concat@^1.0.0:
version "1.0.3"
resolved "https://registry.yarnpkg.com/concat/-/concat-1.0.3.tgz#40f3353089d65467695cb1886b45edd637d8cca8"
dependencies:
commander "^2.9.0"
concat@azer/concat:
version "1.0.0"
resolved "https://codeload.github.com/azer/concat/tar.gz/c64c5cbc2e60b0bc1a8f4bceafed661f66f19dcf"
dependencies:
parallel-loop azer/parallel-loop
serial-loop azer/serial-loop
decamelize@^1.1.1:
version "1.2.0"
resolved "https://registry.yarnpkg.com/decamelize/-/decamelize-1.2.0.tgz#f6534d15148269b20352e7bee26f501f9a191290"
escape-string-regexp@^1.0.2:
version "1.0.5"
resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz#1b61c0562190a8dff6ae3bb2cf0200ca130b86d4"
has-ansi@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/has-ansi/-/has-ansi-2.0.0.tgz#34f5049ce1ecdf2b0649af3ef24e45ed35416d91"
dependencies:
ansi-regex "^2.0.0"
invert-kv@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/invert-kv/-/invert-kv-1.0.0.tgz#104a8e4aaca6d3d8cd157a8ef8bfab2d7a3ffdb6"
is-fullwidth-code-point@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz#ef9e31386f031a7f0d643af82fde50c457ef00cb"
dependencies:
number-is-nan "^1.0.0"
"jquery-mousewheel@>= 3.1.13":
version "3.1.13"
resolved "https://registry.yarnpkg.com/jquery-mousewheel/-/jquery-mousewheel-3.1.13.tgz#06f0335f16e353a695e7206bf50503cb523a6ee5"
"jquery@>= 1.7.2":
version "3.2.1"
resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.2.1.tgz#5c4d9de652af6cd0a770154a631bba12b015c787"
lcid@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/lcid/-/lcid-1.0.0.tgz#308accafa0bc483a3867b4b6f2b9506251d1b835"
dependencies:
invert-kv "^1.0.0"
number-is-nan@^1.0.0:
version "1.0.1"
resolved "https://registry.yarnpkg.com/number-is-nan/-/number-is-nan-1.0.1.tgz#097b602b53422a522c1afb8790318336941a011d"
os-locale@^1.4.0:
version "1.4.0"
resolved "https://registry.yarnpkg.com/os-locale/-/os-locale-1.4.0.tgz#20f9f17ae29ed345e8bde583b13d2009803c14d9"
dependencies:
lcid "^1.0.0"
parallel-loop@azer/parallel-loop:
version "0.0.2"
resolved "https://codeload.github.com/azer/parallel-loop/tar.gz/054b0d3fe633483a3a6b94104c8343473208d5fb"
php-date-formatter@^1.3.4:
version "1.3.4"
resolved "https://registry.yarnpkg.com/php-date-formatter/-/php-date-formatter-1.3.4.tgz#09a15ae0766ba0beb1900c27c1ec319ef2e4563e"
serial-loop@azer/serial-loop:
version "0.0.1"
resolved "https://codeload.github.com/azer/serial-loop/tar.gz/99c6271f80f075b7db089a1aadc7178a310a4570"
string-width@^1.0.1:
version "1.0.2"
resolved "https://registry.yarnpkg.com/string-width/-/string-width-1.0.2.tgz#118bdf5b8cdc51a2a7e70d211e07e2b0b9b107d3"
dependencies:
code-point-at "^1.0.0"
is-fullwidth-code-point "^1.0.0"
strip-ansi "^3.0.0"
strip-ansi@^3.0.0, strip-ansi@^3.0.1:
version "3.0.1"
resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-3.0.1.tgz#6a385fb8853d952d5ff05d0e8aaf94278dc63dcf"
dependencies:
ansi-regex "^2.0.0"
supports-color@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-2.0.0.tgz#535d045ce6b6363fa40117084629995e9df324c7"
uglifycss@^0.0.27:
version "0.0.27"
resolved "https://registry.yarnpkg.com/uglifycss/-/uglifycss-0.0.27.tgz#53553b8115de26dce57b42ba0b34e88dd80d0cde"
uglifyjs@^2.4.10:
version "2.4.11"
resolved "https://registry.yarnpkg.com/uglifyjs/-/uglifyjs-2.4.11.tgz#3440d64e045759589524418eb641c68bb90d113e"
window-size@^0.1.4:
version "0.1.4"
resolved "https://registry.yarnpkg.com/window-size/-/window-size-0.1.4.tgz#f8e1aa1ee5a53ec5bf151ffa09742a6ad7697876"
wrap-ansi@^2.0.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-2.1.0.tgz#d8fc3d284dd05794fe84973caecdd1cf824fdd85"
dependencies:
string-width "^1.0.1"
strip-ansi "^3.0.1"
y18n@^3.2.0:
version "3.2.1"
resolved "https://registry.yarnpkg.com/y18n/-/y18n-3.2.1.tgz#6d15fba884c08679c0d77e88e7759e811e07fa41"
yargs@^3.30.0:
version "3.32.0"
resolved "https://registry.yarnpkg.com/yargs/-/yargs-3.32.0.tgz#03088e9ebf9e756b69751611d2a5ef591482c995"
dependencies:
camelcase "^2.0.1"
cliui "^3.0.3"
decamelize "^1.1.1"
os-locale "^1.4.0"
string-width "^1.0.1"
window-size "^0.1.4"
y18n "^3.2.0"