如何讀取日曆日期在MVC爲Model屬性

我有示範性如何讀取日曆日期在MVC爲Model屬性

public DateTime SelectedDate { get; set; } 
public DateTime SelectedDateTo { get; set; }

視圖有

<input id="Testdate-Field" type="text" style="width: 125px;" value="@Html.DisplayTextFor(m=>m.SelectedDate)" /> To 
    <input id="TestdateTo-Field" type="text" style="width: 125px;" value="@Html.DisplayTextFor(m=>m.SelectedDateTo)" />

要顯示在視圖中的日曆我

$("#Testdate-Field").bind("click", function(event) {  
    $("#Testdate-Field").datepicker(); 
    });  

     $("#TestdateTo-Field").bind("click", function(event) {  
    $("#TestdateTo-Field").datepicker(); 
    });

現在，有2個問題

當我第一次點擊輸入框時，日曆不會出現，直到我點擊其他地方，然後在日期的輸入框中。
當我從日曆中選擇日期時，我的模型屬性SelectedDate和SelectedDateTo不會更改，並且在我閱讀它們時保持默認值。我需要做什麼來閱讀輸入日期？

---更新--- 在準備加此按建議

$("#Testdate-Field").datepicker(); 
$("#TestdateTo-Field").datepicker();

和第一個問題就解決了！現在如何將我在日期欄中選擇的內容綁定到我的模型屬性？

來源

2013-01-21 Tulips

首先在ready DOM模型中初始化＃TestdateTo-Field。 – Mediator

對於問題1，不要將.datepicker（）代碼放入綁定事件中。簡單地執行那些文件準備：

<script> 
    jQuery(document).ready(function ($) { 
     $("#Testdate-Field").datepicker(); 
     $("#TestdateTo-Field").datepicker(); 
    }); 
</script>

關於第二個問題，使用HTML輔助生成您的輸入，然後在你的控制器，你可以很容易地將它們綁定：而不是使用DisplayTextFor輸入標籤您生成的內部，使用TextBoxFor生成輸入標籤爲您提供：

視圖模型：

public class SampleViewModel 
{ 
    // other properties here 
    public DateTime SelectedDate { get; set; } 
    public DateTime SelectedDateTo { get; set; } 
    // other properties here 
}

查看：

@model SampleClassViewModel 
@using(Html.BeginForm()) 
{ 
    @Html.TextBoxFor(m => m.SelectedDate, new { class = "datepickers" }) 
    @Html.TextBoxFor(m => m.SelectedDateTo, new { class = "datepickers" }) 
    <input type="submit" /> 
} 
<script> 
    jQuery(document).ready(function ($) { 
     $(".datepickers").datepicker(); 
    }); 
</script>

有綁定你的財產多路，這裏有一對夫婦... 控制器選項1：

[HttpPost] 
public ActionResult SomeControllerAction(SampleViewModel model) 
{ 
    // do work... 
}

控制器選項2：

[HttpPost] 
public ActionResult SomeControllerAction() 
{ 
    var model = SomeServiceMethodToBuildModel(); 
    this.TryUpdateModel(model); 
    // do work... 
}

謝謝！

來源

2013-01-21 11:06:20

謝謝。這工作！因此，對於問題2，我如何將從日期選擇器中選擇的內容綁定到我的模型日期屬性？我在我的問題中寫了我所看到的兩條線。 – Tulips

如何讀取日曆日期在MVC爲Model屬性

回答

相關問題