Date Time Picker

Date Time Picker

Take a close-up product, based on the ASP. NET MVC framework, for example, and talk about the date-time selectors they use. Related Source: http://www.jinhusns.com/Products/Download?type=whp

Overview

Function description

Built on the jquery UI Datepicker (V1.8.7) and Jquery-ui-timepicker-addon plug-ins, and provides the following key features:

• 1. Custom date formats
• 2. Limit the range of dates you can select
• 3. You can set whether to select time

For more information, see:

• JQuery UI datepicker:http://jqueryui.com/demos/datepicker/
• jquery-ui-timepicker-addon:http://trentrichardson.com/examples/timepicker/

Example

Custom date formats

Use only the "Y", "M", "D" three format specifiers

View Source code

Limit the range of dates you can select

By setting MinDate, MaxDate, you can set values for the following conditions: static date, Integer, empty, date expression

Static Date:Date format, must be consistent with the format of the date set, the default setting is "YYYY-MM-DD"integer:Refers to how many days are added relative to the current date, for example: its value is "2" and the current date is "2012-01-05", then the corresponding date is "2012-01-03"Empty:Indicates no LimitDate Expression:Refers to expressions that are evaluated based on the current date, allow the date units "Y", "M", "W", "D" to be used, and more instructions see Date Expressions View Source code

Select time

View Source code

Using in forms

To use the date selector template, set the data marker datatype for the form item in Editmodel. If you need to select a time, you can set [DataType (Datatype.datetime)], otherwise [DataType (Datatype.date)].

Allows you to set the data marker DateRange for a table item in Editmodel to control the range of dates that the user selects, for example: [DateRange (MinDate = "0", maxdate= "1w+2d")], and the specific numeric settings and restrictions can be selected for the same date range

View Source code

Complete example

View Source code FAQ

What is a date expression?

Refers to expressions that are evaluated based on the current date, and we can easily control the date range using expressions. It has the following characteristics:

• An expression can be thought of as being stitched together by multiple children, allowing spaces between children
• Each subkey is in the form of [sign bit] [digit bit] [date unit], where the symbol bit can have an optional value of "+" or "-" and can omit the sign bit
• Date units are case insensitive
• Do not fill in the date unit, the default is day

The allowed date units are described below:

1. Y , y -How many years are added on the basis of the current year, for example: "+12y", the current date is "2012-01-05", which means "2024-01-05"
2. M , M -adds months to the current month, for example: "+2m", the current date is "2012-01-05", which means "2012-03-05"
3. W , W -How many weeks are added on the basis of the current date, for example: "+1W" and the current date is "2012-01-05", which means "2012-01-12"
4. D , D -How many days are added on the basis of the current year, for example: " -2d", the current date is "2012-01-05", which means "2012-01-03"

Date Time Picker