Bootstrap Date Time Control

datetime Control

Bootstrap a DateTime control, which is very simple to use.

First, add a reference to the date-time control

@*datetime control *@
    <link href= "~/content/bootstrap/css/bootstrap-datetimepicker.min.css" rel= "stylesheet"/ >
    <script src= "~/content/bootstrap/js/moment-with-locales.js" ></script>
    <script src= "~ /content/bootstrap/js/bootstrap-datetimepicker.min.js "></script>
    <script src=" ~/content/ Bootstrap/js/bootstrap-datetimepicker.zh-cn.js "></script>

Link: http://pan.baidu.com/s/1sl56aw1 Password: jc2y
Page code

<a class= ' input-group date ' id= ' dateTimePicker1 ' style= ' float:left; left:320px; " >
                <input type= ' text ' class= "Form-control" id= ' nowdate ' style= "width:150px; height:30px;"/>
                < Span class= "Input-group-addon" style= "float:left; width:50px; height:30px; " >
                    <span class= "Glyphicon glyphicon-calendar" ></span>
                </span>
            </a>

JavaScript code

the DateTime control is set to function as a date () {
    $ (' #datetimepicker1 '). DateTimePicker ({
        language: ' ZH-CN ',//display Chinese
        Format: ' Yyyy-mm-dd ',//display format
        minview: ' Month ',//settings only display to month
        initialdate:new Date (),
        autoclose:true,// Check Auto close
        todaybtn:true,//Show Today button
        Locale:moment.locale (' ZH-CN ')
    });
    The default gets the current date
    var today = new Date ();
    var nowdate = (Today.getfullyear ()) + "-" + (Today.getmonth () + 1) + "-" + today.getdate ();
    Processing of date formats
    var date = new Date (nowdate);
    var mon = date.getmonth () + 1;
    var day = Date.getdate ();
    var mydate = date.getfullyear () + "-" + (Mon < 10?) "0" + Mon:mon) + "-" + (Day < 10?) "0" + day:day);
    document.getElementById ("Nowdate"). Value = MyDate;
}

The setting of the DateTime control's default value, it should be noted that the ID used in JS is the ID of the input tag.

document.getElementById ("Nowdate"). Value = MyDate;

In addition, setting the default date has a format problem, the page loads after the date time, the month and the number of days is 1~9, it is not in front of 0.

However, the date time after the date time control is selected, it is preceded by 0.

Workaround, first get the current datetime, and then use the format to process it.

    The default gets the current date
    var today = new Date ();
    var nowdate = (Today.getfullyear ()) + "-" + (Today.getmonth () + 1) + "-" + today.getdate ();
    Processing of date formats
    var date = new Date (nowdate);
    var mon = date.getmonth () + 1;
    var day = Date.getdate ();
    var mydate = date.getfullyear () + "-" + (Mon < 10?) "0" + Mon:mon) + "-" + (Day < 10?) "0" + day:day);
    document.getElementById ("Nowdate"). Value = MyDate;