Question

我正在使用ASP.NET制作Web服务。我有三个下拉列表可以工作，但不知何故，当我将代码放入表中时，日期选择器不起作用。但是，当我在外面使用它时，它可以工作。这是我的代码：

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link href="Content/bootstrap.min.css" rel="stylesheet"/>
    <link href="customStyleSheet.css" rel="stylesheet" />
    <link href="css/pikaday.css" rel="stylesheet" type="text/css" />
    <link href="css/theme.css" rel="stylesheet" type="text/css" />
    <link href="css/site.css" rel="stylesheet" type="text/css" />
    <script src="scripts/Pikaday/moment.js" type="text/javascript"></script>
    <script src="scripts/Pikaday/pikaday.js" type="text/javascript"></script>

    <style>
        table{
            font-size:20pt;
        }
        select{
            width:300px;
        }
        TextBox{
            width:300px;
        }
   </style>

</head>
<body>
    <form id="form1" runat="server">

        <%--Left sidebar--%>
            <div class ="col-lg-4">

                <table>
                    <tr>
                        <td>Building</td>
                        <td>
                            <select id="buildings"></select>
                        </td>
                    </tr>

                    <tr>
                        <td>Room</td>
                        <td>
                            <select id="rooms"></select>
                        </td>
                    </tr>

                    <tr>
                        <td>Employee</td>
                        <td>
                            <select id="employees"></select>
                        </td>
                    </tr>

                       <tr>
                        <td>Start Day</td>
                        <td>
                            <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
                            <script = "text/javascript">
                            var picker = new Pikaday(
                                {
                                    field: document.getElementById("TextBox1"),
                                    firstDay: 1,
                                    format: "YYYY-MM-DD",
                                    minDate: new Date('2000-01-01'),
                                    maxDate: new Date('2020-12-31'),
                                    yearRange: [2000,2020],
                                    numberOfMonths: 2
                                });
                            </script>

                        </td>
                    </tr>
                </table>

              <%--Row #1--%>
                <div class ="row">
                    <div class ="col-lg-4">
                        <div class = "singleLabel">Start date:</div>
                    </div>
                    <div class ="col-lg-7">
                        <div class = "textBox"><asp:TextBox ID="TextBox1" runat="server"></asp:TextBox></div>
                           <script = "text/javascript">
                            var picker = new Pikaday(
                                {
                                    field: document.getElementById("TextBox1"),
                                    firstDay: 1,
                                    format: "YYYY-MM-DD",
                                    minDate: new Date('2000-01-01'),
                                    maxDate: new Date('2020-12-31'),
                                    yearRange: [2000,2020],
                                    numberOfMonths: 2
                                });
                            </script>
                     </div>
               </div>

               <%--Row #2--%>
               <div class ="row">
                    <div class ="col-lg-4">
                        <div class = "singleLabel">End date:</div>
                    </div>
                    <div class ="col-lg-7">
                        <div class = "textBox"><asp:TextBox ID="TextBox2" runat="server"></asp:TextBox></div>
                        <script = "text/javascript">
                            var picker = new Pikaday(
                                {
                                    field: document.getElementById("TextBox2"),
                                    format: "YYYY-MM-DD",
                                    firstDay: 1,
                                    minDate: new Date('2000-01-01'),
                                    maxDate: new Date('2020-12-31'),
                                    yearRange: [2000,2020],
                                    numberOfMonths: 2
                                 });
                       </script>
                    </div>
               </div>

            </div>

            <%--Right main column--%>
            <div class ="col-lg-8">
                <div class = "customDiv">Main area</div>
           </div>
     </form>
</body>
</html>

我看过类似的帖子，但我仍然无法看到它。此外，如果可能的话，是否有办法将所有东西整齐地摆放在桌子上。这是一个截图：

非常感谢你的帮助！

我想在一个html页面中有一个日期选择器（pikaday.js）

0 个答案: