Question

我试图让Jquery datepicker工作。尝试过遵循本教程：Datepicker Jquery Tutorial但似乎无法使其发挥作用。

使用了＆＃34; TextBoxFor＆＃34;而不是像这段代码的输入字段：

代码

<label>Departure date</label><br />
@Html.TextBoxFor(m => m.DepartureDate, new { Value = DateTime.Now.ToString("dd-MM-yyyy"), @class = "textbox", @id = "datepicker" })

Jscript代码：

<script>
$(function () {
    $("#datepicker").datepicker();
});

我认为是因为我以错误的方式加载文件，但我不确定。已将文件加载到_Layout文件中：

 <!-- Css files -->
<link href="~/Content/jquery-ui.min.css" rel="stylesheet" />

<!-- Scripts -->
<script src="~/Scripts/jquery-ui.min.js"></script>
<script src="~/Scripts/jquery-ui.js"></script>

以这种方式添加Jslib：

@Scripts.Render("~/bundles/jquery")

可以看到这里有什么问题吗？

使用html代码进行更新

<h3>Booking</h3>

@using (Html.BeginForm())
{
<div class="col-sm-9">

    <div class="col-sm-6">
        <label>Outward route</label><br />
        @Html.DropDownListFor(m => m.DepartureRoute, Model.Routes, new { @class = "dropdownlist" })

        <br />

        <label>Departure date</label><br />
        @Html.TextBoxFor(m => m.DepartureDate, new { Value = DateTime.Now.ToString("dd-MM-yyyy"), @class = "textbox", @id = "datepicker" })

        <br />

        <label>Adults:</label><br />
        @Html.DropDownListFor(m => Model.adults, Model.Number, new { @class = "dropdownlist" })
    </div>

    <div class="col-sm-6">

        <label>Return route</label><br />
        @Html.TextBoxFor(m => m.ReturnRoute, new { @class = "dropdownlist" })

        <br />

        <label>Return date</label><br />
        @Html.TextBoxFor(m => m.ReturnDate, new { Value = DateTime.Now.AddDays(+1).ToString("dd-MM-yyyy"), @class = "textbox", @id = "datepicker2" })

        <br />

        <label>Childrens:</label><br />
        @Html.DropDownListFor(m => Model.childrens, Model.Number, new { @class = "dropdownlist" }

    </div>

</div>

<div class="col-sm-3">
    <label>Booking infomation:</label><br />
    <button type="submit" class="button_continue">Continue</button>
</div>
}

<script>
$(function () {
    $("#datepicker").datepicker();
});  
</script>

带有Jquery的Datepicker，没有任何内容显示在文本框上

0 个答案: