Date, DateTime: Difference between revisions

From NSB App Studio
Jump to navigation Jump to search
← Older edit
Brendon (talk | contribs)
1,002 edits
No edit summary
No edit summary
 
(36 intermediate revisions by 6 users not shown)
Line 1: Line 1:
[[file:Datetime.jpg]]
[[file:Dateios.png|thumb|200px|Date on iOS]]
[[file:Timeios.png|thumb|200px|Time on iOS]]
[[File:DateAndroidMM.png|thumb|200px|Date control on Android Chrome]]


'''Description'''
== Description ==


The Date and DateTime controls allow the input of a date. The result is returned as a string in ''value''.
The Date and DateTime controls allow the input of a date. The result is returned as a string in ''value''.
Line 7: Line 9:
When the control is selected at runtime, a special date picker is displayed.
When the control is selected at runtime, a special date picker is displayed.


It is supported starting with iOS 5. It is not supported on Android at this time.
It is supported starting with iOS 5 and Android 4. Not supported in IE11 or Firefox.


To add a control to your app, choose the control’s icon in the Toolbar, then position it on the Design Screen. Use the Property Editor to set the properties you need, then add functions to your code to respond to the events that come from the control: usually, just onclick.
To add a control to your app, choose the control’s icon in the Toolbar, then position it on the Design Screen. Use the Property Editor to set the properties you need, then add functions to your code to respond to the events that come from the control: usually, just onclick.


'''Properties'''
== Properties ==


Standard [[properties|properties]] are supported.
Standard [[properties and methods|properties]] are supported, plus


{| class="wikitable"
{| class="wikitable"
|-
|-
| value || The date value of the control.
| max || The latest date in the format YYYY-MM-DD.
|-
| min || The earliest date in the format YYYY-MM-DD.
|-
| value || The date value of the control. To set at runtime:
<pre>
  Date1.value = "2014-05-23"
  DateTime1.value = "2014-05-23T14:03"
  Month1.value = "2014-05"
  Time1.value = "14:03"
</pre>
|}
 
== Events ==
 
Standard [[events|events]] are supported.
 
== Example ==
 
<tabber>
JavaScript=
<syntaxhighlight lang="JavaScript">
// Date Example - set to current date on start


For the Date control, use the format 2012-01-06.
Form1.onshow = function() {
  var dt = new Date();
  var dd = '0'+dt.getDate().toString();
  dd = dd.substr(dd.length-2,2);
  var mm = '0'+(dt.getMonth()+1).toString();
  mm = mm.substr(mm.length-2,2);
  var yyyy = dt.getYear()+1900;
  var Today = yyyy + '-' + mm + '-' + dd;
  Date1.value = FormatDateTime (Today)
}


For DateTime, use 2012-01-06T09:13:58
// Get the date (month, day, year)
|}
Calendar1.onclick = function() {
    var iDayOfMonth;
    var iMonth;
    var iYear;
 
    iDayOfMonth = $("#Calendar1").jqxCalendar("getDate").getDate();
    iMonth = $("#Calendar1").jqxCalendar("getDate").getMonth() + 1;
    iYear = $("#Calendar1").jqxCalendar("getDate").getFullYear();
 
    TextBoxMonth.value = iMonth;
    TextBoxDay.value = iDayOfMonth;
    TextBoxYear.value = iYear;
};
 
ButtonSetDate.onclick = function() {
    $("#Calendar1").jqxCalendar("setDate", new Date());
};
</syntaxhighlight>
|-|
BASIC=
<syntaxhighlight lang="vb.net">
Rem Date Example - set to current date on start
Function Form1_onshow()
  Date1.value = FormatDateTime(Date, "yyyy-mm-dd")
  DateTime1.value = FormatDateTime(Date,"yyyy-mm-dd") & "T" & FormatDateTime(Now,vbShortTime)
End Function


'''Events'''
Rem Get the date (month, day, year)
Function Calendar1_onclick()
  Dim iDayOfMonth
  Dim iMonth
  Dim iYear
 
  iDayOfMonth = $("#Calendar1").jqxCalendar("getDate").getDate()
  iMonth = $("#Calendar1").jqxCalendar("getDate").getMonth() + 1 
  iYear = $("#Calendar1").jqxCalendar("getDate").getFullYear()
 
  TextBoxMonth.value = iMonth
  TextBoxDay.value = iDayOfMonth
  TextBoxYear.value = iYear 
End Function


Standard [[events|events]] are supported.  
Function ButtonSetDate_onclick()
    $("#Calendar1").jqxCalendar("setDate", new Date())
End Function
</syntaxhighlight>
</tabber>


'''Example'''
== Output ==


<pre>
<pre>
(value is set to "2011-10-12" for Date)
(value is set to "2011-11-12T13:59:17.011" for DateTime)
</pre>
</pre>


'''Output'''
== Related Items ==
 
[[month|Month]], [[time|Time]]


<pre>
[[Category:Language Reference]]
(value is set to “2011-10-12” for Date)
(value is set to “2011-11-12T13:59:17.011” for DateTime)
</pre>


'''Related Items'''
[[Category:Controls]]


[[month|MONTH]], [[time|TIME]]
[[Category:Common]]

Latest revision as of 14:06, 24 July 2019

Date on iOS
Time on iOS
Date control on Android Chrome

Description

The Date and DateTime controls allow the input of a date. The result is returned as a string in value.

When the control is selected at runtime, a special date picker is displayed.

It is supported starting with iOS 5 and Android 4. Not supported in IE11 or Firefox.

To add a control to your app, choose the control’s icon in the Toolbar, then position it on the Design Screen. Use the Property Editor to set the properties you need, then add functions to your code to respond to the events that come from the control: usually, just onclick.

Properties

Standard properties are supported, plus

max The latest date in the format YYYY-MM-DD.
min The earliest date in the format YYYY-MM-DD.
value The date value of the control. To set at runtime: 
  Date1.value = "2014-05-23"
  DateTime1.value = "2014-05-23T14:03"
  Month1.value = "2014-05"
  Time1.value = "14:03"

Events

Standard events are supported.

Example

// Date Example - set to current date on start

Form1.onshow = function() {
  var dt = new Date();
  var dd = '0'+dt.getDate().toString();
  dd = dd.substr(dd.length-2,2);
  var mm = '0'+(dt.getMonth()+1).toString();
  mm = mm.substr(mm.length-2,2);
  var yyyy = dt.getYear()+1900;
  var Today = yyyy + '-' + mm + '-' + dd;
  Date1.value = FormatDateTime (Today)
}

// Get the date (month, day, year)
Calendar1.onclick = function() {
    var iDayOfMonth;
    var iMonth;
    var iYear;

    iDayOfMonth = $("#Calendar1").jqxCalendar("getDate").getDate();
    iMonth = $("#Calendar1").jqxCalendar("getDate").getMonth() + 1;
    iYear = $("#Calendar1").jqxCalendar("getDate").getFullYear();

    TextBoxMonth.value = iMonth;
    TextBoxDay.value = iDayOfMonth;
    TextBoxYear.value = iYear;
};

ButtonSetDate.onclick = function() {
    $("#Calendar1").jqxCalendar("setDate", new Date());
};


Rem Date Example - set to current date on start
Function Form1_onshow()
  Date1.value = FormatDateTime(Date, "yyyy-mm-dd")
  DateTime1.value = FormatDateTime(Date,"yyyy-mm-dd") & "T" & FormatDateTime(Now,vbShortTime)
End Function

Rem Get the date (month, day, year)
Function Calendar1_onclick()
   Dim iDayOfMonth 
   Dim iMonth
   Dim iYear
   
   iDayOfMonth = $("#Calendar1").jqxCalendar("getDate").getDate()
   iMonth = $("#Calendar1").jqxCalendar("getDate").getMonth() + 1  
   iYear = $("#Calendar1").jqxCalendar("getDate").getFullYear()
   
   TextBoxMonth.value = iMonth
   TextBoxDay.value = iDayOfMonth
   TextBoxYear.value = iYear  
 End Function

 Function ButtonSetDate_onclick()
     $("#Calendar1").jqxCalendar("setDate", new Date())
 End Function

Output

(value is set to "2011-10-12" for Date)
(value is set to "2011-11-12T13:59:17.011" for DateTime)

Related Items

Month, Time

Retrieved from "https://wiki.appstudio.dev/index.php?title=Date,_DateTime&oldid=10508"