From aa01e4bcc10d1ecd3e5a3a5e8856bfd99e34fdd7 Mon Sep 17 00:00:00 2001 From: Valeriy Date: Tue, 26 Nov 2013 13:35:22 +0600 Subject: [PATCH] New Version 1.0.9 Add documentation from xdsoft.net for collective changes --- doc.tpl | 396 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 396 insertions(+) create mode 100644 doc.tpl diff --git a/doc.tpl b/doc.tpl new file mode 100644 index 0000000..5c586a8 --- /dev/null +++ b/doc.tpl @@ -0,0 +1,396 @@ + +

+Use this plugin to unobtrusively add a datetimepicker, datepicker or timepicker dropdown to your forms. It's easy to customize options. Source code on GitHub or download (zip). +

+parse('adsense5')?> +parse('donate')?> +

DateTimepicker

+
+

TimePicker

+
+

DatePicker

+
+

Inline DateTimePicker

+
+ +

+

+Download (zip) +

+

How do I use it?

+

+First include to page css and js files +

<!-- this should go after your </body> -->
+<link rel="stylesheet" type="text/css" href="jquery.datetimepicker.css"/ >
+<script src="jquery.js"></script>
+<script src="jquery.datetimepicker.js"></script>
+

+

Examples

+

Simple init DateTimePicker Example

+

HTML

+
<input id="datetimepicker" type="text" >
+

JavaScript

+
$('#datetimepicker').datetimepicker();
+

Result

+

+ +

i18n DatePicker Example

+

JavaScript

+
$('#datetimepicker1').datetimepicker({
+ lang:'de',
+ i18n:{de:{
+   months:[
+       'Januar','Februar','März','April','Mai','Juni','Juli','August',
+       'September','Oktober','November','Dezember',],
+    dayOfWeek:["So.", "Mo", "Di", "Mi", "Do", "Fr", "Sa.",],
+ }},
+timepicker:false,
+format:'d.m.Y',
+});
+

Result

+

+ +

Only TimePicker Example

+

JavaScript

+
$('#datetimepicker2').datetimepicker({
+	datepicker:false,
+	format:'H:i',
+});
+

Result

+

+ +

Inline DateTimePicker Example

+

JavaScript

+
$('#datetimepicker3').datetimepicker({
+  format:'d.m.Y H:i',
+  inline:true,
+  lang:'ru',
+});
+

Result

+

+ +

Icon trigger

+

Click the icon next to the input field to show the datetimepicker

+

JavaScript

+
$('#datetimepicker4').datetimepicker({
+  format:'d.m.Y H:i',
+  lang:'ru',
+});
+and handler onclick event +
$('#image_button').click(function(){
+  $('#datetimepicker4').datetimepicker('show'); //support hide,show and destroy command
+});
+

Result

+
+
+
+ + + + +
+
+
+ +

allowTimes options TimePicker Example

+

JavaScript

+
$('#datetimepicker5').datetimepicker({
+	datepicker:false,
+	allowTimes:['12:00', '13:00', '15:00', '17:00', '17:05', '17:20', '19:00', '20:00'],
+});
+

Result

+

+ +

handler changeDateTime Example

+

JavaScript

+
$('#datetimepicker6').datetimepicker({
+	timepicker:false,
+	onChangeDateTime:function(dp,$input){
+		alert($input.val())
+	},
+});
+

Result

+

+ +

Full options list

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Name defaultDescrEx.
valuenullCurrent value datetimepicker. If it is set, ignored input.value +
{value:'12.03.2013',
+ format:'d.m.Y',}
+
langenLanguage i18n (en,ru,de,nl) +
{lang:'ru'}
+
formatY/m/d H:iFormat datetime. More  +
{format:'H'}
+{format:'Y'}
+
formatDateY/m/dFormat date for minDate and maxDate
{formatDate:'d.m.Y'}
formatTimeH:i Similarly, formatDate . But for minTime and maxTime
{formatTime:'H'}
step60Step time +
{step:5}
+
closeOnDateSelect0 + +
{closeOnDateSelect:true}
closeOnWithoutClicktrue
{ closeOnWithoutClick :false}
timepickertrue
{timepicker:false}
datepickertrue
{datepicker:false}
minDatefalse
{minDate:0,} // today
+{minDate:'2013/12/03'}
+{minDate:'05.12.2013',formatDate:'d.m.Y'}
maxDatefalse
{maxDate:0,}
+{maxDate:'2013/12/03'}
+{maxDate:'05.12.2013',formatDate:'d.m.Y'}
minTimefalse
{minTime:0,}// now
+{minTime:'12:00'}
+{minTime:'13:45:34',formatTime:'H:i:s'}
maxTimefalse
{maxTime:0,}
+{maxTime:'12:00'}
+{maxTime:'13:45:34',formatTime:'H:i:s'}
allowTimes[]
{allowTimes:[
+	'09:00',
+	'11:00',
+	'12:00',
+	'21:00'
+]}
openedfalse 
inlinefalse 
timepickerScrollbartrue 
onSelectDatefunction(){}
onSelectDate:function(current_time,$input){
+  alert(current.dateFormat('d/m/Y'))
+}
onSelectTimefunction(){} 
onChangeMonthfunction(){} 
onChangeDateTimefunction(){} 
onShowfunction(){} 
onClosefunction(){} 
withoutCopyrighttrue 
inverseButtonfalse 
hours12false 
dayOfWeekStart0 +

Star week DatePicker. Default Sunday - 0.

+ +

Monday - 1 ...

+
 
\ No newline at end of file