2012-09-26 57 views
0

我有一個動態生成的行的HTML表(使用MVC3的EditorFor)。用戶填寫表中的數據(逐行),然後將表單提交給服務器(通過MVC3 HTML表單)。用戶可以通過按下TR元素上的$(tableRow).remove()按鈕來刪除行,然後調用異步服務器方法從數據庫中刪除行。jquery刪除導致mvc3發佈失敗

我發現如果我在表格中說5行並刪除第三行然後提交,服務器方法會收到第1行和第2行,但會丟失其他行(原始第4行和第5行)。

我試着在網上搜索,爲什麼回發會收到前兩行,並錯過了最後兩個,但所有我能找到的答案圍繞JQuery帖子,我沒有使用。

任何幫助或方向都會很棒,請讓我知道是否需要澄清任何事情。

編輯:從我的項目中添加適用於該問題的代碼。如果你需要更多上下文的代碼,請告訴我,我會添加它。

//////////////// VIEW //////////////// 
// model info and initialization logic 
@using (Html.BeginForm("EditTimesheet", "ControllerName", FormMethod.Post, new { enctype = "multipart/form-data", id = "editTimesheet" })) 
{ 
@Html.ValidationSummary(true) 
<fieldset> 
<table width="100%"> 
<tr> 
    <td colspan="14" align="right"> 
    // lots of code 
    </td> 
</tr> 
@Html.EditorFor(m => m.Rows) 
<tr> 
    <td colspan="14" align="right"> 
    // lots of code 
    </td> 
</tr> 
// closing statements 

//////////////// EditorFor //////////////// 
// model info and initialization logic 
<tr class="timesheet-row"> 
    <td> 
     <a href='#'> 
      <img src='@Url.Content("~/Content/Images/delete.gif")' 
        width='17' height='17' style='border: 0;' 
        onclick="DeleteRow(this, @Model.RowId)" /> 
     </a> 
    </td> 
    // other td's 
</tr> 

//////////////// JS file //////////////// 
function DeleteRow(box, rowId) 
{ 
    $(box).closest(".timesheet-row").remove(); 

    // HACK: despicable, detestable HACK! 
    var url = deleteRowUrl; 
    url += '?rowId=' + rowId; 
    var ajaxData = { 
     type: "POST", 
     url: url, 
     dataType: "json", 
     contentType: "application/json; charset=utf-8", 
     data: null, 
     success: null, 
     error: function (error) { 
      alert("There was an error posting the data to the server: " + error.responseText); 
     } 
    }; 
    $.ajax(ajaxData); 
} 
+2

代碼請??? –

回答

2

當你刪除您在集合中創建的名稱的指標行和默認模型聯編程序停止工作,因爲您不再尊重預期的格式。

因此,而不是具有下列順序值:

<input type="text" name="Items[0].Id" value="1" /> 
<input type="text" name="Items[1].Id" value="2" /> 
<input type="text" name="Items[2].Id" value="3" /> 
<input type="text" name="Items[3].Id" value="4" /> 
<input type="text" name="Items[4].Id" value="5" /> 

,如果你刪除你最終與TR元件上的第三排與$(tableRow).remove()

<input type="text" name="Items[0].Id" value="1" /> 
<input type="text" name="Items[1].Id" value="2" /> 
<input type="text" name="Items[3].Id" value="4" /> 
<input type="text" name="Items[4].Id" value="5" /> 

看這個問題?

這裏的an article這說明了如何使用調用自定義幫助解決這個問題Html.BeginCollectionItem和它使用的收集,而不是整數索引輸入字段的名稱的GUID。還要檢查Phil Haacks article有關默認模型聯編程序期望您的字段被命名的語法。最後有一段叫做非順序指數,其中介紹瞭如何做到這一點。

+0

完美!謝謝! – Sabe

0

聲音就像您窗體的一部分被刪除。

  1. Inspect the DOM
  2. 找到你的形式
  3. 刪除一行,並看看有什麼變化