以 Razor 形式使用日期选择器 - ASP.NET MVC

Question

我有一个我喜欢并且有效的日期选择器。它显示为一个与我的表单的其余部分一致的整洁的框，单击该框会提示一个日期选择器组件，当选择日期时，会填充一个文本框。

标记：

<div class="form-group">
    <div id="datepicker-group" class="input-group date" data-date-format="dd/mm/yyyy">
        <input class="form-control" name="data" type="text" />
        <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
    </div>
</div>

JQuery

 <script>    
        $(document).ready(function() {
            $("#datepicker-group").datepicker({
                format: "dd-M-yyyy",
                todayHighlight: true,
                autoclose: true,
                clearBtn: true
            });
        });
 </script> 

我还有一个正在使用

@Html.BeginForm

构建的表单，模型中的其他属性通过

@Html.TextBoxFor

和自由文本字段分配其值，这非常简单。如何将此日期选择器 div 放入可分配给我的

StartDate

属性的表单字段中？除了能够单击该框并弹出日期选择器组件的功能之外，我还想保留当前日期选择器框的外观和感觉。

Answer 1

在 Razor 中您还可以执行以下操作：

<input asp-for="StartDate" type="date" class="form-control" />

type

可以是：

• 日期
• 日期时间
• 本地日期时间

Answer 2

你能不能不这样做

<div class="form-group">
    <div id="datepicker-group" class="input-group date" data-date-format="dd/mm/yyyy">
        @Html.TextBoxFor(x => x.StartDate, new {@class="form-control" })         
        <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
    </div>
</div>

Answer 3

在 Razor (dotnet core 8) 中，您还可以执行以下操作：

@Html.EditorFor(model => model.Date, new { htmlAttributes = new { @class = "form-control", type = "date" } })

类型可以是：

日期， 约会时间， 本地日期时间