2013-06-29 51 views
2

我目前正在研究jQuery日期選擇器,我想限制用戶從每個月的第一天到每個月的第28天選擇日期。限制MVC3中jQuery DatePicker的日期範圍Razor

28日後的剩餘日期將不可選擇,我想實現這一點。有沒有辦法可以做到這一點。

就像一個想法,我試圖把數據註釋放在Model類的date變量上,但不知道該怎麼做。我相信看起來更復雜的其他選項是在日期選擇器出現時使不想要的日期不可選。

+0

你可以介意相同的參數 – Manish

回答

1

讓我們先看看html/js的樣子。因此,使用日期選擇器的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文檔:http://api.jqueryui.com/datepicker/#option-beforeShowDay

Theres幾種方法將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> 

你可以看看How can I get the property name in my MVC3 custom Editor Template以獲得更多支持,以獲取屬性名稱到編輯器中。