DateTime

The common properties of datetime are:

property Description
Id Control ID, generated by default according to the bound field name
Field Binding field, required
Disabled Disabled,or not
Name Control name, generated by default according to the bound field name
LabelText Label content
LabelWidth Label length, default= 80
HideLabel Hide label,or not
Type Display mode: year, month, date, time and datetime
Range Enable date range selection, default=false
RangeSplit Time range separator， default‘~’
Min/Max 1. If the value tpye is character: mm / DD / yyyy must be divided by ‘-’(middle dash) and hour, minute and second must be divided by ‘:’ (half colon). The format set by format is not followed here. 2. If the value type is integer and the number is less than 86400000, then the number represents the number of days, such as Min: - 7, that is, the minimum date is 7 days ago, and the positive number represents several days later 3. If the value type is integer type and the number ≥ 86400000, then the number represents the time stamp, such as Max: 4073558400000, i.e. the maximum date is January 1, 3000 A.D
Format Time custom format; default value: yyyy-mm-d yyyy year, at least four digits. If it is less than four digits, then zero y year will be filled.There is no limit to the number of digits, no matter how many digits of the year, zero MM month will be filled in front of it. If it is less than two digits, zero shall be filled in front. M month, one digit allowed. DD date, at least two digits. If there are less than two digits, zero shall be filled in front. D date, one digit is allowed. HH hours, at least two digits. If there are less than two digits, zero shall be filled in front. H hours, one digit allowed. Mm minutes, at least two digits. If it is less than two digits, zero shall be filled in front. M minutes, one digit of SS seconds is allowed, at least two digits. If there are less than two digits, zero shall be filled in front. S seconds, one digit allowed.
ZIndex Stacking order , generally used to solve the problem of mutual concealment with other elements. If the position parameter is set to static, it is not valid;Type: number,default: 666666
ShowBottom Show bottom bar or not
Lang Language ,Default:CN,Options:CN, en
Calendar Whether to display the Gregorian calendar festival or not; there are some built-in important festivals of the general Gregorian calendar in China, which can be enabled by setting true. The international version will not be displayed.
Mark Note important date note format description the date of each year
ReadyFunc Control's initial callback, which is triggered when the control is opened. The callback returns two parameters: the initial date time object and the current instance object
ChangeFunc The callback after the date time is switched will be triggered when any of date month and year is switched. The callback returns four parameters,:generated value, date time object, end date time object and current instance object
DoneFunc Callback sfter the control is selected; click date, clear, now and confirm will trigger; he callback returns four parameters:generated value, date time object, end date time object and current instance object.

DateTime usage

@{
    var mark = new Dictionary<string, string>()
    {
        {"0-9-18", "Mark1" },
        {"0-0-15", "Middle" },
        {"2018-05-24", "Publish" }
    };
}

<wt:form vm="@Model" width="600">
    <wt:datetime field="Entity.EnRollDate" min="2018-01-01" max="2038-08-01" type="Date" show-bottom="false" />
    <wt:datetime field="Entity.EnRollDateRange" min="2018-01-01" max="2038-08-01" type="Date" range="true" confirm-only="true" />
    <wt:datetime field="Entity.EnYearRange" min="2016-1-1" max="2038-08-01" type="Year" range="true" confirm-only="true" />
    <wt:datetime field="Entity.EnMonthRange" min="2018-01-01" max="2038-08-01" type="Month" range="true" confirm-only="true" />
    <wt:datetime field="Entity.EnTimeRange" min="12:09:09" max="20:00:00" type="Time" range="true" />
    <wt:datetime field="Entity.EnTimeRange0"
                    min="2018-01-01 00:00:00"
                    max="2038-08-01 23:59:59"
                    type="DateTime"
                    range="true"
                    range-split="~"
                    format="yyyy-MM-ddTHH:mm:ss" />
    <wt:datetime field="Entity.EnTimeRange1"
                    type="DateTime"
                    lang="DateTimeLangEnum.EN" />
    <wt:datetime field="Entity.EnTimeRange2"
                    type="DateTime"
                    calendar="true" />
    <wt:datetime field="Entity.EnTimeRange3"
                    type="DateTime"
                    mark="@mark" />
    <wt:datetime field="Entity.EnTimeRange4"
                    type="DateTime"
                    range="true"
                    ready-func="readyFunc"
                    change-func="changeFunc"
                    done-func="doneFunc" confirm-only="true" />
    <wt:row align="AlignEnum.Right">
        <wt:submitbutton disabled="true" />
        <wt:closebutton disabled="true" />
    </wt:row>
</wt:form>

<script>
layui.use('code',function(){layui.code({ about: false })})
    layui.table.init('parse-table-demo', { limit: 100, height: 'full-400' });

    function readyFunc(value, _this) {
        console.log("readyFunc");
        console.log(value)
        console.log(_this)
    }
    function changeFunc(value, date, endDate, _this) {
        console.log("changeFunc");
        console.log(value)
        console.log(date)
        console.log(endDate)
        console.log(_this)
    }
    function doneFunc(value, date, endDate, _this) {
        console.log("doneFunc");
        console.log(value)
        console.log(date)
        console.log(endDate)
        console.log(_this)
    }
</script>