jQuery EasyUI / TopJUI creation date and time input box

jQuery EasyUI / TopJUI creation date and time input box

Date and time input box assembly

 

HTML

Date input boxes and the like, date and time input box allows the user to select a date and time specified and displayed in a specified output format. Compared date input box, which adds a time spinner in the drop-down panel.

<div class="topjui-container">
    <fieldset>
        <Legend> Default date and time input box </ legend>
    </fieldset>

    <div class="topjui-row">
        <div class="topjui-col-sm6">
            <Label class = "topjui-form-label"> Start Time </ label>
            <div class="topjui-input-block">
                <input name="birthday"
                       data-toggle="topjui-datetimebox"
                       data-options="required:true,
                   width:450,
                   showSeconds: false "> // whether to show the seconds information
            </div>
        </div>
        <div class="topjui-col-sm6">
            <Label class = "topjui-form-label"> End Time </ label>
            <div class="topjui-input-block">
                <input name="birthday"
                       data-toggle="topjui-datetimebox"
                       data-options="required:true,
                   width:450,
                   showSeconds:true">
            </div>
        </div>
    </div>
</div>

　　js

<input id="dt" type="text" name="birthday">
$('#dt').iDatetimebox({
    value: '3/4/2010 2:3',
    required: true,
    showSeconds: false
});

Set date and time input box

$ ( '# Dt') iDatetimebox ( 'setValue', '6/1/2012 12:30:56');. // set the date and time input box value
var v = $ ( '# dt') iDatetimebox ( 'getValue');. // get the value of the date and time input box
alert(v);

　　

 

EasyUI Chinese network: http://www.jeasyui.cn

TopJUI front-end frame: http://www.topjui.com

TopJUI exchange community: http://ask.topjui.com