Question

我使用的是Bootstrap 3 Datepicker，特别是No Icon (input field only)版本。

我正在尝试使用minDate功能，以便用户无法输入我选择的日期之前的日期，但我无法弄清楚如何设置它没有图标版本。我可以用图标做到这一点。

这就是我所拥有的：

HTML /剃须刀

@{
    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重载辅助方法中，但是如何？

另外我知道在视图中做逻辑是不受欢迎的，我可以/应该使用View Model，但我只是想先测试一下。

感谢任何帮助。

Answer 1

啊，我想出来了。通过向razor 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})

设置DateTime选择器的最小日期

1 个答案: