为日期时间选择器设置最小日期

Question

我正在使用 Bootstrap 3 Datepicker, specifically the No Icon (input field only) 版本。

我正在尝试使用 minDate 函数，这样用户将无法输入在我选择的日期之前的日期，但我不知道如何设置它使用无图标版本。我可以用图标做到这一点。

这是我的：

HTML/Razor

@{
    var firstDate = new Test.Models.MS();
    using (var db = new UCEntities())
    {
        firstDate = db.MSies.Where(x => x.AID == Model.AId && x.deleted == false).OrderBy(x => x.Date).FirstOrDefault();
    }
}

<div class="col-md-4">
    <div class="input-group date date-search-box" data-mindate="@firstDate.Date">
        @Html.TextBox("date", null, htmlAttributes: new { id = "datetimepicker1", @class = "form-control", @placeholder = "Enter Date"})
        <span class="input-group-btn">
            <button class="btn btn-primary" type="submit">Search Date</button>
        </span>
    </div>
</div>

jQuery

$(document).ready(function () {
    $("#datetimepicker1").datetimepicker({
        format: 'MM/DD/YYYY',
        minDate: $("#datetimepicker1").data("mindate")
    });
});

我觉得 data-mindate 需要包含在 @Html.TextBox 重载辅助方法中，但是如何呢？

我也知道在视图中做逻辑是不受欢迎的，我 could/should 使用视图模型，但我只想先测试一下。

感谢任何帮助。

Answer 1

啊，我明白了。通过向剃刀 Html 助手添加数据属性，您必须使用 _ 而不是 -。

例如：

@Html.TextBox("date", null, htmlAttributes: new { id = "datetimepicker1", @class = "form-control", @placeholder = "Enter Date",data_mindate=firstDate.Date})

而不是：

@Html.TextBox("date", null, htmlAttributes: new { id = "datetimepicker1", @class = "form-control", @placeholder = "Enter Date",data-mindate=firstDate.Date})

为日期时间选择器设置最小日期

Setting Min-Date for DateTime picker

jquery

asp.net-mvc

razor

eonasdan-datetimepicker