2012-11-01 10 views
2

我是一個相當新的MVC3,但我正在寫一個MVC3應用程序需要加載一個jQuery對話框中的DateTime列表,但是當我去回發到服務器,DateTime的List不會被髮送。在jQuery對話框中的MVC3數據不回發到服務器

我累加在一個隱藏的元素爲每個日期的列表中這樣

@for (int i = 0; i < Model.ListOfDates.Count; i++) 
{ 
    @Html.HiddenFor(x => x.ListOfDates[i]) 
} 

但後來我得到試圖改變在jQuery的日期選擇器的日期時出現以下錯誤:

Microsoft JScript runtime error: Unable to set value of the property 'currentDay': object is null or undefined

有人能告訴我我做錯了什麼嗎?我創建了一個測試程序來證明:

型號

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 

namespace Stupid_Dates_Test.Models 
{ 
    public class Model 
    { 
     public string StringProperty { get; set; } 
     public int IntProperty { get; set; } 
     public List<DateTime> ListOfDates { get; set; } 
    } 
} 

控制器

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using System.Web.Mvc; 
using Stupid_Dates_Test.Models; 

namespace Stupid_Dates_Test.Controllers 
{ 
    public class HomeController : Controller 
    { 
     public ActionResult Index() 
     { 
      Model m = new Model(); 
      m.StringProperty = "This is a string property"; 
      m.IntProperty = 100; 
      m.ListOfDates = new List<DateTime>(); 
      m.ListOfDates.Add(new DateTime(2012, 11, 1)); 
      m.ListOfDates.Add(new DateTime(2012, 11, 2)); 
      m.ListOfDates.Add(new DateTime(2012, 11, 3)); 
      m.ListOfDates.Add(new DateTime(2012, 11, 4)); 
      m.ListOfDates.Add(new DateTime(2012, 11, 5)); 
      return View(m); 
     } 

     public void Save(Model m) 
     { 
      // Save Code 
     } 
    } 
} 

查看

<script src="../../Scripts/jquery-1.5.1.min.js" type="text/javascript"></script> 
<script src="../../Scripts/jquery-ui-1.8.11.min.js" type="text/javascript"></script> 
<link href="../../Content/themes/base/jquery.ui.all.css" rel="stylesheet" type="text/css" /> 

@model Stupid_Dates_Test.Models.Model 
<form id="frmMain" action=""> 
@Html.EditorFor(x => x.StringProperty) 
@Html.EditorFor(x => x.IntProperty) 

@*@for (int i = 0; i < Model.ListOfDates.Count; i++) 
{ 
    @Html.HiddenFor(x => x.ListOfDates[i]) 
}*@ 

<a href="javascript:ShowDates()">Edit List of Dates</a> 
<div id="dlgDates" style="display: none;"> 
    @for (int i = 0; i < Model.ListOfDates.Count; i++) 
    { 
     @Html.EditorFor(x => x.ListOfDates[i]) 
    } 
</div> 
</form> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     var today = new Date(); 
     var dd = today.getDate(); 
     var mm = today.getMonth() + 1; 
     var yyyy = today.getFullYear(); 
     if (dd < 10) { dd = '0' + dd } 
     if (mm < 10) { mm = '0' + mm } 
     today = mm + '/' + dd + '/' + yyyy; 
     $(":input[data-datepicker]").datepicker({ defaultDate: today }); 
    }); 

    function ShowDates() { 
     $("#dlgDates").dialog({ 
      autoOpen: true, 
      closeOnEscape: false, 
      width: 500, 
      height: 400, 
      resizable: false, 
      title: "Dates", 
      modal: true, 
      draggable: false, 
      open: function() { 
       $("#dlgDates").show(); 
      }, 
      buttons: { 
       "Save": function() { 
        $.ajax({ 
         type: "POST", 
         url: '/Home/Save/', 
         data: $("#frmMain").serialize(), 
         success: function() { 
          // Save Code 
          alert('Saved successfully!'); 
          $('#dlgDates').dialog('destroy'); 
         }, 
         error: function() { 
          alert('Error'); 
         } 
        }); 
       } 
      } 
     }); 
    } 
</script> 

的DateTime編輯模板

@model System.DateTime 
@Html.TextBox("", (Model == null ? "" : Convert.ToDateTime(ViewData.TemplateInfo.FormattedModelValue).ToShortDateString()), new { data_datepicker = true }) 
+1

你有一個不匹配的剃刀評論('顯示* @')在你的代碼(關閉'@ for'後),另外,你可以使用helper'使用(Html.BeginForm()){...}'而不是手動創建'form'標籤 – GolfWolf

+0

修復剃刀評論,I剛開始時忘了複製。 –

回答

0

有幾個相關的問題: 1)選擇器是錯誤的。 :根據我的理解,input [data-datepicker]選擇type =「date-datepicker」的輸入。 Html.TextBoxFor呈現類型爲「text」的輸入,請嘗試向輸入字段添加一個類,以便您可以使用類似input.datepck的內容來選擇它們。

2)當您使用jQuery的對話框插件,日期字段不會被髮送到服務器(他們沒有在HTTP請求中

相關問題