剃刀使用js的mvc模型的部分更新

我有一個表顯示一些數據作爲名稱郵件和id。剃刀使用js的mvc模型的部分更新

<table id="da-ex-datatable-numberpaging" class="da-table"> 
    <thead> 
     <tr> 
      <th>Name</th> 
      <th>Mail</th> 
      <th>Operations</th> 
     </tr> 
    </thead> 
    <tbody> 
    @foreach(var c in Model.models) 
    {  
    <form method="post" action="EditCustomer" >        
     <tr> 
      <td>@c.name</td> 
      <td>@c.mail</td> 
      <td> 
       <input type="button" value="Edit" onclick="edit()" /> 
       <input type="submit" value="Save"/> 
      </td> 
     </tr> 
    </form> 
    } 
    </tbody> 
</table>

我想要做的就是隻編輯名字和郵件一行。在表格最右邊的一列中，我有兩個按鈕作爲編輯和保存。當我點擊編輯我的

<td>john doe</td>

到

<td><input type="text" name="nameE" id="3nameE" value="john doe" /></td>

使用此JavaScript方法

function edit(tag) { 

    var id = tag.getAttribute("id"); 
    var name = document.getElementById(id + "name").innerHTML; 
    var mail = document.getElementById(id + "mail").innerHTML; 

    document.getElementById(id + "name").innerHTML = '<input type="text" name="nameE" id="' + id + 'nameE" value="' + name + '" />'; 
    document.getElementById(id + "mail").innerHTML = '<input type="text" name="mailE" id="' + id + 'mailE" value="' + mail + '" />'; 
}

和用戶編輯對文本框元素變換。

我的問題是在哪裏放置窗體以及如何獲取控制器上的發佈值？正如你看到我的模型中有一個客戶列表。但我想單獨更新它們。我知道當我提交表單時，模型會傳遞給客戶端，但是我剛剛更改的值沒有放入模型中，因爲我已經使用javascript創建了這些輸入。我迷路了，請在這裏幫助我。我可能混淆了事物，不要猶豫建議改變整體方法。

來源

2013-07-18 Tolga Evcimen

您應該保留一個與您的模型綁定的隱藏輸入;當用戶更改該值時，將其複製到隱藏的輸入中，以便將其發送回控制器。 – Mathletics

@Mathletics你可能會考慮發佈這個答案。 –

您可以在頁面上已經有<input>，綁定到模型，並使用javascript隱藏/顯示。

相反的：就當有人點擊編輯輸入和跨度對象

@for (var i = 0; i < Model.models.Count; i++) 
{ 
    ... 
    <td> 
     <span>@Model.models[i].name</span> 
     @Html.TextBoxFor(x => x.models[i].name, new { @style = "display:none" }); 
    </td> 
    ... 
}

使用jQuery .show()和.hide()：

@foreach(var c in Model.models) 
{ 
    ... 
    <td>@c.name</td> 
    ... 
}

嘗試。

產生的輸入名稱可能看起來很奇怪，但他們會綁定到正確的模型假設你有一個表格（不是每行一個），以及看起來像這樣一個控制器方法：

[HttpPost] 
public ActionResult EditCustomers(MyViewModel model) 
{ 
    // model.models works here 
    ... 
}

This post可能對你也有幫助。

來源

2013-07-19 00:56:54 Alden

感謝您的全面回答，這很有道理，但有兩點我不明白，1）我怎麼知道哪一行需要在控制器端更新？ 2）如何知道在點擊編輯時輸入需要隱藏並顯示在哪一行上？ –

剃刀使用js的mvc模型的部分更新

回答

相關問題