{C#-JavaScript} 套用JS Calendar

1.下載JS Calendar

2.載入 CSS與JS
        <link type="text/css" href="Jscript/JSCal2-1.9/src/css/jscal2.css" rel="Stylesheet" />
        <link type="text/css" href="Jscript/JSCal2-1.9/src/css/border-radius.css" rel="Stylesheet" />
        <link type="text/css" href="Jscript/JSCal2-1.9/src/css/reduce-spacing.css" rel="Stylesheet" />
       <script type="text/JavaScript" src="Jscript/JSCal2-1.9/src/js/jscal2.js"></script>
    <script type="text/JavaScript" src="Jscript/JSCal2-1.9/src/js/unicode-letter.js"></script>
    <script type="text/JavaScript" src="Jscript/JSCal2-1.9/src/js/lang/b5.js"></script>

3.先建立控制項 搭配script 執行js檔
Note:建立控制項使用<input>頁籤創件，如是使用asp.net建立控制項則會因為runat="server"，當按下button或其觸發，日曆只會曇花一現....
<input type="text" id="date" name="date" size="10" >
   <input type="button" value="..." id="BTNTest" name="BTN">
   <script type="text/javascript">
        new Calendar({
            inputField: "date",
        dateFormat: "%Y/%m/%d",
        trigger: "BTNTest",
        bottomBar: true,
        weekNumbers: true,
        showTime: 24,
        onSelect: function() {this.hide();}
        });
    </script>
new Calendar其屬性要參考.js的API:http://www.dynarch.com/projects/calendar/doc/#printDate
inputField=日期所要放置的控制ID
trigger=觸發.JS的控件ID
onSelect: function() {this.hide();}=選擇後，則日曆隱藏