Question

我目前正在研究jQuery日期选择器，我想限制用户选择从每月1日到每月28日的日期。

28日之后的剩余日期将无法选择，我想实现这一目标。有什么办法可以做到。

就像一个想法，我试图将数据注释放在Model类的日期变量上，但后来不知道如何做到这一点。我认为看起来更复杂的其他选项是在日期选择器出现时使不需要的日期不可选。

Answer 1

让我们首先回顾一下html / js的样子。因此，使用datepicker的beforeShowDay属性来限制可以显示的天数

的javascript

$('#date').datepicker({
   beforeShowDay: function(date){ return [date.getDate() <= 28,""];}
})

HTML

<input id="date" type="text" value="">

这是一个js小提琴http://jsfiddle.net/dWaLq/来证明这一点。这里是相关的jquery ui docs：http://api.jqueryui.com/datepicker/#option-beforeShowDay

有几种方法可以将javascript / html连接到您的视图。

一个选项是使用UIHintAttribute指定要与日期属性一起使用的视图模型

在您的viewmodel中

 [UIHint("LimitedDate")]
 public DateTime date {get;set;}

并在您的视图中

 @Html.EditorFor(m => m.date)

您可以在视图中使用自定义视图LimitedDate.cshtml＆gt;分享＆gt;编辑文件夹

@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>

您可以查看How can I get the property name in my MVC3 custom Editor Template以获取有关将属性名称添加到编辑器中的更多支持。

在MVC3 Razor中限制jQuery DatePicker中的日期范围

1 个答案: