mirror of
https://github.com/xdan/datetimepicker.git
synced 2024-11-18 06:24:22 +00:00
New version 2.5.10
This commit is contained in:
parent
9de4639abf
commit
4d3019c858
114
doc.tpl
114
doc.tpl
@ -39,7 +39,7 @@ jQuery('#datetimepicker_dark').datetimepicker({
|
|||||||
[include scripts/pp/reklama1.php]
|
[include scripts/pp/reklama1.php]
|
||||||
<h2>How do I use it?</h2>
|
<h2>How do I use it?</h2>
|
||||||
<p>First include to page css and js files</p>
|
<p>First include to page css and js files</p>
|
||||||
<pre><code data-language="html"><!-- this should go after your </body> -->
|
<pre><code class="language-html"><!-- this should go after your </body> -->
|
||||||
<link rel="stylesheet" type="text/css" href="jquery.datetimepicker.css"/ >
|
<link rel="stylesheet" type="text/css" href="jquery.datetimepicker.css"/ >
|
||||||
<script src="jquery.js"></script>
|
<script src="jquery.js"></script>
|
||||||
<script src="build/jquery.datetimepicker.full.min.js"></script></code></pre>
|
<script src="build/jquery.datetimepicker.full.min.js"></script></code></pre>
|
||||||
@ -47,9 +47,9 @@ jQuery('#datetimepicker_dark').datetimepicker({
|
|||||||
<hr id="Simple" />
|
<hr id="Simple" />
|
||||||
<h4>Simple init DateTimePicker Example <a href="#Simple">#</a></h4>
|
<h4>Simple init DateTimePicker Example <a href="#Simple">#</a></h4>
|
||||||
<p>HTML</p>
|
<p>HTML</p>
|
||||||
<pre><code data-language="html"><input id="datetimepicker" type="text" ></code></pre>
|
<pre><code class="language-html"><input id="datetimepicker" type="text" ></code></pre>
|
||||||
<p><strong>javaScript</strong></p>
|
<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><strong>Result</strong></p>
|
||||||
<p><input id="_datetimepicker" type="text" value="2014/03/15 05:06" /></p>
|
<p><input id="_datetimepicker" type="text" value="2014/03/15 05:06" /></p>
|
||||||
<script type="text/javascript">// <![CDATA[
|
<script type="text/javascript">// <![CDATA[
|
||||||
@ -59,7 +59,7 @@ jQuery(function(){jQuery('#_datetimepicker').datetimepicker();});
|
|||||||
<h4>i18n DatePicker Example <a href="#i18n">#</a></h4>
|
<h4>i18n DatePicker Example <a href="#i18n">#</a></h4>
|
||||||
<p>All supported languages <a href="#lang">here</a></p>
|
<p>All supported languages <a href="#lang">here</a></p>
|
||||||
<p><strong>javaScript</strong></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({
|
jQuery('#datetimepicker1').datetimepicker({
|
||||||
i18n:{
|
i18n:{
|
||||||
@ -98,7 +98,7 @@ format:'d.m.Y'
|
|||||||
<hr id="TimePicker" />
|
<hr id="TimePicker" />
|
||||||
<h4>Only TimePicker Example <a href="#TimePicker">#</a></h4>
|
<h4>Only TimePicker Example <a href="#TimePicker">#</a></h4>
|
||||||
<p><strong>javaScript</strong></p>
|
<p><strong>javaScript</strong></p>
|
||||||
<pre><code data-language="javascript">jQuery('#datetimepicker2').datetimepicker({
|
<pre><code class="language-javascript">jQuery('#datetimepicker2').datetimepicker({
|
||||||
datepicker:false,
|
datepicker:false,
|
||||||
format:'H:i'
|
format:'H:i'
|
||||||
});</code></pre>
|
});</code></pre>
|
||||||
@ -114,7 +114,7 @@ jQuery('#_datetimepicker2').datetimepicker({
|
|||||||
// ]]></script>
|
// ]]></script>
|
||||||
<h3 id="startdateex">Date Time Picker start date <a href="#startdateex">#</a></h3>
|
<h3 id="startdateex">Date Time Picker start date <a href="#startdateex">#</a></h3>
|
||||||
<p><strong>javaScript</strong></p>
|
<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
|
startDate:'+1971/05/01'//or 1986/12/08
|
||||||
});</code></pre>
|
});</code></pre>
|
||||||
<p><strong>Result</strong></p>
|
<p><strong>Result</strong></p>
|
||||||
@ -128,7 +128,7 @@ jQuery(function(){
|
|||||||
// ]]></script>
|
// ]]></script>
|
||||||
<h3 id="unixtime">Date Time Picker from unixtime <a href="#unixtime">#</a></h3>
|
<h3 id="unixtime">Date Time Picker from unixtime <a href="#unixtime">#</a></h3>
|
||||||
<p><strong>javaScript</strong></p>
|
<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'
|
format:'unixtime'
|
||||||
});</code></pre>
|
});</code></pre>
|
||||||
<p><strong>Result</strong></p>
|
<p><strong>Result</strong></p>
|
||||||
@ -143,7 +143,7 @@ jQuery(function(){
|
|||||||
<hr id="Inline" />
|
<hr id="Inline" />
|
||||||
<h4>Inline DateTimePicker Example <a href="#Inline">#</a></h4>
|
<h4>Inline DateTimePicker Example <a href="#Inline">#</a></h4>
|
||||||
<p><strong>javaScript</strong></p>
|
<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',
|
format:'d.m.Y H:i',
|
||||||
inline:true,
|
inline:true,
|
||||||
lang:'ru'
|
lang:'ru'
|
||||||
@ -163,12 +163,12 @@ jQuery('#_datetimepicker3').datetimepicker({
|
|||||||
<h4>Icon trigger <a href="#trigger">#</a></h4>
|
<h4>Icon trigger <a href="#trigger">#</a></h4>
|
||||||
<p>Click the icon next to the input field to show the datetimepicker</p>
|
<p>Click the icon next to the input field to show the datetimepicker</p>
|
||||||
<p><strong>javaScript</strong></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',
|
format:'d.m.Y H:i',
|
||||||
lang:'ru'
|
lang:'ru'
|
||||||
});</code></pre>
|
});</code></pre>
|
||||||
<p>and handler onclick event</p>
|
<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
|
jQuery('#datetimepicker4').datetimepicker('show'); //support hide,show and destroy command
|
||||||
});</code></pre>
|
});</code></pre>
|
||||||
<p><strong>Result</strong></p>
|
<p><strong>Result</strong></p>
|
||||||
@ -192,7 +192,7 @@ jQuery('#image_button').click(function(){
|
|||||||
<hr id="allowTimes" />
|
<hr id="allowTimes" />
|
||||||
<h4>allowTimes options TimePicker Example <a href="#allowTimes">#</a></h4>
|
<h4>allowTimes options TimePicker Example <a href="#allowTimes">#</a></h4>
|
||||||
<p><strong>javaScript</strong></p>
|
<p><strong>javaScript</strong></p>
|
||||||
<pre><code data-language="javascript">jQuery('#datetimepicker5').datetimepicker({
|
<pre><code class="language-javascript">jQuery('#datetimepicker5').datetimepicker({
|
||||||
datepicker:false,
|
datepicker:false,
|
||||||
allowTimes:[
|
allowTimes:[
|
||||||
'12:00', '13:00', '15:00',
|
'12:00', '13:00', '15:00',
|
||||||
@ -212,7 +212,7 @@ jQuery('#_datetimepicker5').datetimepicker({
|
|||||||
<hr id="onChangeDateTime" />
|
<hr id="onChangeDateTime" />
|
||||||
<h4>handler onChangeDateTime Example <a href="#onChangeDateTime">#</a></h4>
|
<h4>handler onChangeDateTime Example <a href="#onChangeDateTime">#</a></h4>
|
||||||
<p><strong>javaScript</strong></p>
|
<p><strong>javaScript</strong></p>
|
||||||
<pre><code data-language="javascript">jQuery('#datetimepicker6').datetimepicker({
|
<pre><code class="language-javascript">jQuery('#datetimepicker6').datetimepicker({
|
||||||
timepicker:false,
|
timepicker:false,
|
||||||
onChangeDateTime:function(dp,$input){
|
onChangeDateTime:function(dp,$input){
|
||||||
alert($input.val())
|
alert($input.val())
|
||||||
@ -233,7 +233,7 @@ jQuery('#_datetimepicker6').datetimepicker({
|
|||||||
<hr id="mindate" />
|
<hr id="mindate" />
|
||||||
<h4>minDate and maxDate Example <a href="#mindate">#</a></h4>
|
<h4>minDate and maxDate Example <a href="#mindate">#</a></h4>
|
||||||
<p><strong>javaScript</strong></p>
|
<p><strong>javaScript</strong></p>
|
||||||
<pre><code data-language="javascript">jQuery('#datetimepicker7').datetimepicker({
|
<pre><code class="language-javascript">jQuery('#datetimepicker7').datetimepicker({
|
||||||
timepicker:false,
|
timepicker:false,
|
||||||
formatDate:'Y/m/d',
|
formatDate:'Y/m/d',
|
||||||
minDate:'-1970/01/02',//yesterday is minimum date(for today use 0 or -1970/01/01)
|
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" />
|
<hr id="mask" />
|
||||||
<h4>Use mask input Example <a href="#mask">#</a></h4>
|
<h4>Use mask input Example <a href="#mask">#</a></h4>
|
||||||
<p><strong>javaScript</strong></p>
|
<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,
|
timepicker:false,
|
||||||
mask:true, // '9999/19/39 29:59' - digit is the maximum possible for a cell
|
mask:true, // '9999/19/39 29:59' - digit is the maximum possible for a cell
|
||||||
});</code></pre>
|
});</code></pre>
|
||||||
@ -273,7 +273,7 @@ jQuery('#_datetimepicker_mask').datetimepicker({
|
|||||||
<h4>Set options runtime DateTimePicker <a href="#runtime_options">#</a></h4>
|
<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>If select day is Saturday, the minimum set 11:00, otherwise 8:00</p>
|
||||||
<p><strong>javaScript</strong></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
|
// 'this' is jquery object datetimepicker
|
||||||
if( currentDateTime.getDay()==6 ){
|
if( currentDateTime.getDay()==6 ){
|
||||||
this.setOptions({
|
this.setOptions({
|
||||||
@ -312,7 +312,7 @@ jQuery('#_datetimepicker_runtime').datetimepicker({
|
|||||||
<h4>After generating a calendar called the event onGenerate <a href="#ongenerate">#</a></h4>
|
<h4>After generating a calendar called the event onGenerate <a href="#ongenerate">#</a></h4>
|
||||||
<p>Invert settings minDate and maxDate</p>
|
<p>Invert settings minDate and maxDate</p>
|
||||||
<p><strong>javaScript</strong></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 ){
|
onGenerate:function( ct ){
|
||||||
jQuery(this).find('.xdsoft_date')
|
jQuery(this).find('.xdsoft_date')
|
||||||
.toggleClass('xdsoft_disabled');
|
.toggleClass('xdsoft_disabled');
|
||||||
@ -339,7 +339,7 @@ jQuery('#_datetimepicker_ongenerate').datetimepicker({
|
|||||||
<hr id="weekends_disable" />
|
<hr id="weekends_disable" />
|
||||||
<h4>disable all weekend <a href="#weekends_disable">#</a></h4>
|
<h4>disable all weekend <a href="#weekends_disable">#</a></h4>
|
||||||
<p><strong>javaScript</strong></p>
|
<p><strong>javaScript</strong></p>
|
||||||
<pre><code data-language="javascript">jQuery('#datetimepicker9').datetimepicker({
|
<pre><code class="language-javascript">jQuery('#datetimepicker9').datetimepicker({
|
||||||
onGenerate:function( ct ){
|
onGenerate:function( ct ){
|
||||||
jQuery(this).find('.xdsoft_date.xdsoft_weekend')
|
jQuery(this).find('.xdsoft_date.xdsoft_weekend')
|
||||||
.addClass('xdsoft_disabled');
|
.addClass('xdsoft_disabled');
|
||||||
@ -364,7 +364,7 @@ jQuery('#_datetimepicker_weekends_disable').datetimepicker({
|
|||||||
<hr id="use_other_date_parser" />
|
<hr id="use_other_date_parser" />
|
||||||
<h4>Use another date parser/formatter<a href="#use_other_date_parser">#</a></h4>
|
<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>
|
<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) {
|
parseDate: function (date, format) {
|
||||||
var d = moment(date, format);
|
var d = moment(date, format);
|
||||||
return d.isValid() ? d.toDate() : false;
|
return d.isValid() ? d.toDate() : false;
|
||||||
@ -376,7 +376,7 @@ jQuery('#_datetimepicker_weekends_disable').datetimepicker({
|
|||||||
});
|
});
|
||||||
</code></pre>
|
</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>
|
<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',
|
format:'DD.MM.YYYY h:mm a',
|
||||||
formatTime:'h:mm a',
|
formatTime:'h:mm a',
|
||||||
formatDate:'DD.MM.YYYY'
|
formatDate:'DD.MM.YYYY'
|
||||||
@ -384,7 +384,7 @@ jQuery('#_datetimepicker_weekends_disable').datetimepicker({
|
|||||||
<hr id="range" />
|
<hr id="range" />
|
||||||
<h4>Range between date<a href="#range">#</a></h4>
|
<h4>Range between date<a href="#range">#</a></h4>
|
||||||
<p><strong>javaScript</strong></p>
|
<p><strong>javaScript</strong></p>
|
||||||
<pre><code data-language="javascript">jQuery(function(){
|
<pre><code class="language-javascript">jQuery(function(){
|
||||||
jQuery('#date_timepicker_start').datetimepicker({
|
jQuery('#date_timepicker_start').datetimepicker({
|
||||||
format:'Y/m/d',
|
format:'Y/m/d',
|
||||||
onShow:function( ct ){
|
onShow:function( ct ){
|
||||||
@ -447,7 +447,7 @@ jQuery(function(){
|
|||||||
<td>null</td>
|
<td>null</td>
|
||||||
<td>Current value datetimepicker. If it is set, ignored input.value</td>
|
<td>Current value datetimepicker. If it is set, ignored input.value</td>
|
||||||
<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>
|
format:'d.m.Y'}</code></pre>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
@ -512,7 +512,7 @@ jQuery(function(){
|
|||||||
|
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
<pre><code data-language="javascript">$.datetimepicker.setLocale('ru');</code></pre>
|
<pre><code class="language-javascript">$.datetimepicker.setLocale('ru');</code></pre>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr id="format">
|
<tr id="format">
|
||||||
@ -520,7 +520,7 @@ jQuery(function(){
|
|||||||
<td>Y/m/d H:i</td>
|
<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>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>
|
<td>
|
||||||
<pre><code data-language="javascript">{format:'H'}
|
<pre><code class="language-javascript">{format:'H'}
|
||||||
{format:'Y'}{format:'unixtime'}</code></pre>
|
{format:'Y'}{format:'unixtime'}</code></pre>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
@ -529,7 +529,7 @@ jQuery(function(){
|
|||||||
<td>Y/m/d</td>
|
<td>Y/m/d</td>
|
||||||
<td>Format date for minDate and maxDate</td>
|
<td>Format date for minDate and maxDate</td>
|
||||||
<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>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr id="formatTime">
|
<tr id="formatTime">
|
||||||
@ -537,7 +537,7 @@ jQuery(function(){
|
|||||||
<td>H:i</td>
|
<td>H:i</td>
|
||||||
<td> Similarly, formatDate . But for minTime and maxTime</td>
|
<td> Similarly, formatDate . But for minTime and maxTime</td>
|
||||||
<td>
|
<td>
|
||||||
<pre><code data-language="javascript">{formatTime:'H'}</code></pre>
|
<pre><code class="language-javascript">{formatTime:'H'}</code></pre>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr id="step">
|
<tr id="step">
|
||||||
@ -545,7 +545,7 @@ jQuery(function(){
|
|||||||
<td>60</td>
|
<td>60</td>
|
||||||
<td>Step time</td>
|
<td>Step time</td>
|
||||||
<td>
|
<td>
|
||||||
<pre><code data-language="javascript">{step:5}</code></pre>
|
<pre><code class="language-javascript">{step:5}</code></pre>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr id="closeOnDateSelect">
|
<tr id="closeOnDateSelect">
|
||||||
@ -553,7 +553,7 @@ jQuery(function(){
|
|||||||
<td>0</td>
|
<td>0</td>
|
||||||
<td> </td>
|
<td> </td>
|
||||||
<td>
|
<td>
|
||||||
<pre><code data-language="javascript">{closeOnDateSelect:true}</code></pre>
|
<pre><code class="language-javascript">{closeOnDateSelect:true}</code></pre>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr id="closeOnWithoutClick">
|
<tr id="closeOnWithoutClick">
|
||||||
@ -561,7 +561,7 @@ jQuery(function(){
|
|||||||
<td>true</td>
|
<td>true</td>
|
||||||
<td> </td>
|
<td> </td>
|
||||||
<td>
|
<td>
|
||||||
<pre><code data-language="javascript">{ closeOnWithoutClick :false}</code></pre>
|
<pre><code class="language-javascript">{ closeOnWithoutClick :false}</code></pre>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr id="validateOnBlur">
|
<tr id="validateOnBlur">
|
||||||
@ -569,7 +569,7 @@ jQuery(function(){
|
|||||||
<td>true</td>
|
<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>Verify datetime value from input, when losing focus. If value is not valid datetime, then to value inserts the current datetime</td>
|
||||||
<td>
|
<td>
|
||||||
<pre><code data-language="javascript">{ validateOnBlur:false}</code></pre>
|
<pre><code class="language-javascript">{ validateOnBlur:false}</code></pre>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr id="timepicker">
|
<tr id="timepicker">
|
||||||
@ -577,7 +577,7 @@ jQuery(function(){
|
|||||||
<td>true</td>
|
<td>true</td>
|
||||||
<td> </td>
|
<td> </td>
|
||||||
<td>
|
<td>
|
||||||
<pre><code data-language="javascript">{timepicker:false}</code></pre>
|
<pre><code class="language-javascript">{timepicker:false}</code></pre>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr id="datepicker">
|
<tr id="datepicker">
|
||||||
@ -585,7 +585,7 @@ jQuery(function(){
|
|||||||
<td>true</td>
|
<td>true</td>
|
||||||
<td> </td>
|
<td> </td>
|
||||||
<td>
|
<td>
|
||||||
<pre><code data-language="javascript">{datepicker:false}</code></pre>
|
<pre><code class="language-javascript">{datepicker:false}</code></pre>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr id="weeks">
|
<tr id="weeks">
|
||||||
@ -593,7 +593,7 @@ jQuery(function(){
|
|||||||
<td>false</td>
|
<td>false</td>
|
||||||
<td>Show week number</td>
|
<td>Show week number</td>
|
||||||
<td>
|
<td>
|
||||||
<pre><code data-language="javascript">{weeks:true}</code></pre>
|
<pre><code class="language-javascript">{weeks:true}</code></pre>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr id="theme">
|
<tr id="theme">
|
||||||
@ -601,7 +601,7 @@ jQuery(function(){
|
|||||||
<td>'default'</td>
|
<td>'default'</td>
|
||||||
<td>Setting a color scheme. Now only supported default and dark theme</td>
|
<td>Setting a color scheme. Now only supported default and dark theme</td>
|
||||||
<td>
|
<td>
|
||||||
<pre><code data-language="javascript">{theme:'dark'}</code></pre>
|
<pre><code class="language-javascript">{theme:'dark'}</code></pre>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr id="minDate">
|
<tr id="minDate">
|
||||||
@ -609,7 +609,7 @@ jQuery(function(){
|
|||||||
<td>false</td>
|
<td>false</td>
|
||||||
<td> </td>
|
<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:'2013/12/03'}
|
||||||
{minDate:'-1970/01/02'} // yesterday
|
{minDate:'-1970/01/02'} // yesterday
|
||||||
{minDate:'05.12.2013',formatDate:'d.m.Y'}</code></pre>
|
{minDate:'05.12.2013',formatDate:'d.m.Y'}</code></pre>
|
||||||
@ -620,7 +620,7 @@ jQuery(function(){
|
|||||||
<td>false</td>
|
<td>false</td>
|
||||||
<td> </td>
|
<td> </td>
|
||||||
<td>
|
<td>
|
||||||
<pre><code data-language="javascript">{maxDate:0}
|
<pre><code class="language-javascript">{maxDate:0}
|
||||||
{maxDate:'2013/12/03'}
|
{maxDate:'2013/12/03'}
|
||||||
{maxDate:'+1970/01/02'} // tomorrow
|
{maxDate:'+1970/01/02'} // tomorrow
|
||||||
{maxDate:'05.12.2013',formatDate:'d.m.Y'}</code></pre>
|
{maxDate:'05.12.2013',formatDate:'d.m.Y'}</code></pre>
|
||||||
@ -631,7 +631,7 @@ jQuery(function(){
|
|||||||
<td>false</td>
|
<td>false</td>
|
||||||
<td>calendar set date use starDate</td>
|
<td>calendar set date use starDate</td>
|
||||||
<td>
|
<td>
|
||||||
<pre><code data-language="javascript">{startDate:'1987/12/03'}
|
<pre><code class="language-javascript">{startDate:'1987/12/03'}
|
||||||
{startDate:new Date()}
|
{startDate:new Date()}
|
||||||
{startDate:'+1970/01/02'} // tomorrow
|
{startDate:'+1970/01/02'} // tomorrow
|
||||||
{startDate:'08.12.1986',formatDate:'d.m.Y'}</code></pre>
|
{startDate:'08.12.1986',formatDate:'d.m.Y'}</code></pre>
|
||||||
@ -643,7 +643,7 @@ jQuery(function(){
|
|||||||
<td>false</td>
|
<td>false</td>
|
||||||
<td>if input value is empty, calendar set date use defaultDate</td>
|
<td>if input value is empty, calendar set date use defaultDate</td>
|
||||||
<td>
|
<td>
|
||||||
<pre><code data-language="javascript">{defaultDate:'1987/12/03'}
|
<pre><code class="language-javascript">{defaultDate:'1987/12/03'}
|
||||||
{defaultDate:new Date()}
|
{defaultDate:new Date()}
|
||||||
{defaultDate:'+1970/01/02'} // tomorrow
|
{defaultDate:'+1970/01/02'} // tomorrow
|
||||||
{defaultDate:'08.12.1986',formatDate:'d.m.Y'}</code></pre>
|
{defaultDate:'08.12.1986',formatDate:'d.m.Y'}</code></pre>
|
||||||
@ -655,7 +655,7 @@ jQuery(function(){
|
|||||||
<td>false</td>
|
<td>false</td>
|
||||||
<td>if input value is empty, timepicker set time use defaultTime</td>
|
<td>if input value is empty, timepicker set time use defaultTime</td>
|
||||||
<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>
|
{defaultTime:'33-12',formatTime:'i-H'}</code></pre>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
@ -665,7 +665,7 @@ jQuery(function(){
|
|||||||
<td>false</td>
|
<td>false</td>
|
||||||
<td> </td>
|
<td> </td>
|
||||||
<td>
|
<td>
|
||||||
<pre><code data-language="javascript">{minTime:0,}// now
|
<pre><code class="language-javascript">{minTime:0,}// now
|
||||||
{minTime:new Date()}
|
{minTime:new Date()}
|
||||||
{minTime:'12:00'}
|
{minTime:'12:00'}
|
||||||
{minTime:'13:45:34',formatTime:'H:i:s'}</code></pre>
|
{minTime:'13:45:34',formatTime:'H:i:s'}</code></pre>
|
||||||
@ -676,7 +676,7 @@ jQuery(function(){
|
|||||||
<td>false</td>
|
<td>false</td>
|
||||||
<td> </td>
|
<td> </td>
|
||||||
<td>
|
<td>
|
||||||
<pre><code data-language="javascript">{maxTime:0,}
|
<pre><code class="language-javascript">{maxTime:0,}
|
||||||
{maxTime:'12:00'}
|
{maxTime:'12:00'}
|
||||||
{maxTime:'13:45:34',formatTime:'H:i:s'}</code></pre>
|
{maxTime:'13:45:34',formatTime:'H:i:s'}</code></pre>
|
||||||
</td>
|
</td>
|
||||||
@ -686,7 +686,7 @@ jQuery(function(){
|
|||||||
<td>[]</td>
|
<td>[]</td>
|
||||||
<td> </td>
|
<td> </td>
|
||||||
<td>
|
<td>
|
||||||
<pre><code data-language="javascript">{allowTimes:[
|
<pre><code class="language-javascript">{allowTimes:[
|
||||||
'09:00',
|
'09:00',
|
||||||
'11:00',
|
'11:00',
|
||||||
'12:00',
|
'12:00',
|
||||||
@ -752,7 +752,7 @@ jQuery(function(){
|
|||||||
<td>function(){}</td>
|
<td>function(){}</td>
|
||||||
<td> </td>
|
<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'))
|
alert(ct.dateFormat('d/m/Y'))
|
||||||
}</code></pre>
|
}</code></pre>
|
||||||
</td>
|
</td>
|
||||||
@ -791,7 +791,7 @@ jQuery(function(){
|
|||||||
<td><a href="#onClose">onClose</a></td>
|
<td><a href="#onClose">onClose</a></td>
|
||||||
<td>function(current_time,$input){}</td>
|
<td>function(current_time,$input){}</td>
|
||||||
<td> </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');
|
$i.datetimepicker('destroy');
|
||||||
}</code></pre></td>
|
}</code></pre></td>
|
||||||
</tr>
|
</tr>
|
||||||
@ -854,7 +854,7 @@ jQuery(function(){
|
|||||||
<td>round</td>
|
<td>round</td>
|
||||||
<td>Round time in timepicker, possible values: round, ceil, floor</td>
|
<td>Round time in timepicker, possible values: round, ceil, floor</td>
|
||||||
<td>
|
<td>
|
||||||
<pre><code data-language="javascript">{roundTime:'floor'}</code></pre>
|
<pre><code class="language-javascript">{roundTime:'floor'}</code></pre>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr id="dayOfWeekStart">
|
<tr id="dayOfWeekStart">
|
||||||
@ -877,7 +877,7 @@ jQuery(function(){
|
|||||||
<td>[]</td>
|
<td>[]</td>
|
||||||
<td> </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>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr id="disabledDates">
|
<tr id="disabledDates">
|
||||||
@ -885,7 +885,7 @@ jQuery(function(){
|
|||||||
<td>[]</td>
|
<td>[]</td>
|
||||||
<td><p>Disbale all dates in list</p></td>
|
<td><p>Disbale all dates in list</p></td>
|
||||||
<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>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr id="allowDates">
|
<tr id="allowDates">
|
||||||
@ -893,7 +893,7 @@ jQuery(function(){
|
|||||||
<td>[]</td>
|
<td>[]</td>
|
||||||
<td><p>Allow all dates in list</p></td>
|
<td><p>Allow all dates in list</p></td>
|
||||||
<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>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr id="allowDateRe">
|
<tr id="allowDateRe">
|
||||||
@ -901,7 +901,7 @@ jQuery(function(){
|
|||||||
<td>[]</td>
|
<td>[]</td>
|
||||||
<td><p>Use Regex to check dates</p></td>
|
<td><p>Use Regex to check dates</p></td>
|
||||||
<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>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr id="disabledWeekDays">
|
<tr id="disabledWeekDays">
|
||||||
@ -909,7 +909,7 @@ jQuery(function(){
|
|||||||
<td>[]</td>
|
<td>[]</td>
|
||||||
<td><p>Disable days listed by index</p></td>
|
<td><p>Disable days listed by index</p></td>
|
||||||
<td>
|
<td>
|
||||||
<pre><code data-language="javascript">[0, 3, 4]</code></pre>
|
<pre><code class="language-javascript">[0, 3, 4]</code></pre>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr id="id">
|
<tr id="id">
|
||||||
@ -942,30 +942,30 @@ jQuery(function(){
|
|||||||
<h2 id="methods">Methods</h2>
|
<h2 id="methods">Methods</h2>
|
||||||
<h3>show</h3>
|
<h3>show</h3>
|
||||||
<p>Show Datetimepicker</p>
|
<p>Show Datetimepicker</p>
|
||||||
<pre><code data-language="javascript">$('#input').datetimepicker();
|
<pre><code class="language-javascript">$('#input').datetimepicker();
|
||||||
$('button.somebutton').on('click', function () {
|
$('button.somebutton').on('click', function () {
|
||||||
$('#input').datetimepicker('show');
|
$('#input').datetimepicker('show');
|
||||||
});</code></pre>
|
});</code></pre>
|
||||||
<h3>hide</h3>
|
<h3>hide</h3>
|
||||||
<p>Hide Datetimepicker</p>
|
<p>Hide Datetimepicker</p>
|
||||||
<pre><code data-language="javascript">$('#input').datetimepicker();
|
<pre><code class="language-javascript">$('#input').datetimepicker();
|
||||||
$(window).on('resize', function () {
|
$(window).on('resize', function () {
|
||||||
$('#input').datetimepicker('hide');
|
$('#input').datetimepicker('hide');
|
||||||
});</code></pre>
|
});</code></pre>
|
||||||
<h3>toggle</h3>
|
<h3>toggle</h3>
|
||||||
<p>Sgow/Hide Datetimepicker</p>
|
<p>Sgow/Hide Datetimepicker</p>
|
||||||
<pre><code data-language="javascript">$('#input').datetimepicker();
|
<pre><code class="language-javascript">$('#input').datetimepicker();
|
||||||
$('button.trigger').on('click', function () {
|
$('button.trigger').on('click', function () {
|
||||||
$('#input').datetimepicker('toggle');
|
$('#input').datetimepicker('toggle');
|
||||||
});</code></pre>
|
});</code></pre>
|
||||||
<h3>destroy</h3>
|
<h3>destroy</h3>
|
||||||
<p>Destroy datetimepicker</p>
|
<p>Destroy datetimepicker</p>
|
||||||
<pre><code data-language="javascript">$('#input').datetimepicker();
|
<pre><code class="language-javascript">$('#input').datetimepicker();
|
||||||
$('#input').datetimepicker('destroy');
|
$('#input').datetimepicker('destroy');
|
||||||
</code></pre>
|
</code></pre>
|
||||||
<h3>reset</h3>
|
<h3>reset</h3>
|
||||||
<p>Reset datetimepicker's value</p>
|
<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').val('12/01/2006');
|
||||||
$('#input')
|
$('#input')
|
||||||
.datetimepicker('show')
|
.datetimepicker('show')
|
||||||
@ -973,19 +973,19 @@ $('#input')
|
|||||||
</code></pre>
|
</code></pre>
|
||||||
<h3>validate</h3>
|
<h3>validate</h3>
|
||||||
<p>Validate datetimepicker's value </p>
|
<p>Validate datetimepicker's value </p>
|
||||||
<pre><code data-language="javascript">$('#input').datetimepicker();
|
<pre><code class="language-javascript">$('#input').datetimepicker();
|
||||||
$('#input').datetimepicker(validate)
|
$('#input').datetimepicker(validate)
|
||||||
</code></pre>
|
</code></pre>
|
||||||
<h3>setOptions</h3>
|
<h3>setOptions</h3>
|
||||||
<p>Set datetimepicker's options </p>
|
<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'});
|
$('#input').datetimepicker('setOptions', {format: 'd/m/Y'});
|
||||||
//or
|
//or
|
||||||
$('#input').datetimepicker({format: 'd/m/Y'});
|
$('#input').datetimepicker({format: 'd/m/Y'});
|
||||||
</code></pre>
|
</code></pre>
|
||||||
<h3>getValue</h3>
|
<h3>getValue</h3>
|
||||||
<p>Get current datetimepicker's value (Date object) </p>
|
<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 () {
|
$('button.somebutton').on('click', function () {
|
||||||
var d = $('#input').datetimepicker('getValue');
|
var d = $('#input').datetimepicker('getValue');
|
||||||
console.log(d.getFullYear());
|
console.log(d.getFullYear());
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "jquery-datetimepicker",
|
"name": "jquery-datetimepicker",
|
||||||
"version": "2.5.9",
|
"version": "2.5.10",
|
||||||
"description": "jQuery Plugin DateTimePicker it is DatePicker and TimePicker in one",
|
"description": "jQuery Plugin DateTimePicker it is DatePicker and TimePicker in one",
|
||||||
"main": "build/jquery.datetimepicker.full.min.js",
|
"main": "build/jquery.datetimepicker.full.min.js",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
Loading…
Reference in New Issue
Block a user