我目前正在开发 jQuery 日期选择器,我想限制用户选择从每月 1 日到每月 28 日的日期。
28 日之后的剩余日期将无法选择,我想实现这一点。有什么办法我可以做到这一点。
想一想,我试图将数据注释放在 Model 类的日期变量上,但不知道该怎么做。我认为看起来更复杂的其他选项是在日期选择器出现时使不需要的日期不可选。
我目前正在开发 jQuery 日期选择器,我想限制用户选择从每月 1 日到每月 28 日的日期。
28 日之后的剩余日期将无法选择,我想实现这一点。有什么办法我可以做到这一点。
想一想,我试图将数据注释放在 Model 类的日期变量上,但不知道该怎么做。我认为看起来更复杂的其他选项是在日期选择器出现时使不需要的日期不可选。
让我们先来看看 html/js 会是什么样子。因此,使用 datepicker 的 beforeShowDay 属性来限制可以显示的天数
javascript
$('#date').datepicker({
beforeShowDay: function(date){ return [date.getDate() <= 28,""];}
})
html
<input id="date" type="text" value="">
这是一个演示了这一点的 js fiddle http://jsfiddle.net/dWaLq/。这是相关的 jquery ui 文档:http ://api.jqueryui.com/datepicker/#option-beforeShowDay
有几种方法可以将 javascript/html 连接到您的视图。
一种选择是使用 UIHintAttribute 来指定要与日期属性一起使用的视图模型
在您的视图模型中
[UIHint("LimitedDate")]
public DateTime date {get;set;}
在你看来
@Html.EditorFor(m => m.date)
您将在 Views > Shared > Editor 文件夹中有一个自定义视图 LimitedDate.cshtml
@model DateTime
@{var fieldName = ViewData.TemplateInfo.HtmlFieldPrefix;}
<input id="@fieldName" name="@fieldName" type="text" value="@Model.ToString('d')">
<script>
$('#' + '@fieldname').datepicker({
beforeShowDay: function(date){ return [date.getDate() <= 28,""];}
})
</script>
您可以查看如何在我的 MVC3 自定义编辑器模板中获取属性名称,以获得更多关于将属性名称输入编辑器的支持。