根據ASP.Net中的用戶輸入動態地填充表單MVC

Question

我的問題與Engram的here類似，但我的問題更進一步。我打算工作的方式是我有一個文本框詢問用戶要做多少條記錄。在他們輸入數字後，我需要創建更多的文本框以允許輸入（然後用這些文本框重複相同的過程，但是先要使用嬰兒步驟...）我嘗試收集帖子上的密鑰，但它只返回最初的文本框要求輸入的數量。我仍然試圖掌握MVC，目前爲止的教程/視頻還沒有深入研究。然後再次，我知道這可能是我可以使用JQuery處理的東西，但我仍然陷於同樣的情況。

這是我使用的控制器：

[AcceptVerbsAttribute("POST")] 
    public ActionResult Create(int tbxNumberOfExercises) 
    { 
     ViewData["number"] = tbxNumberOfExercises; 
     foreach (var key in Request.Form.Keys) 
     { 
      string keyString = key.ToString(); 
      if (keyString.StartsWith("tbox_exercise", StringComparison.OrdinalIgnoreCase)) 
      { 
       string recNum = keyString.Substring(13, keyString.Length - 13); 
       string approvedKey = Request.Form["tbox_exercise" + recNum]; 
       int number; 
       int.TryParse(approvedKey, out number); 
      } 
     } 
     return View("Create"); 
    } 

這是我的aspx：

<form action="/CreateWorkout/Create" method="post"> 
Number of Exercises: 
<%= Html.TextBox("tbxNumberOfExercises") %> 
<br /> 
<br /> 
<input type="submit" value="Set Exercise Number" /> 
</form> 
<% if (ViewData["number"] != null)%> 
There are this many:<%=Html.Encode(ViewData["number"])%> 
<br /> 
and this line should show up 
<% if (ViewData["number"] != null) 
    { 
     int max = (int)ViewData["number"]; 

     for (int i = 0; i < max; i++) 
     {%> 
      <br /> 
      <br /> 
      <%= Html.TextBox("tbox_exercise" + i) %> 
    <% } 
    } %> 
<% if (ViewData["s"] != null) %> 
<%=Html.Encode(ViewData["s"]) %> 

有我俯瞰，不理解的東西，或者我應該退出，而我因爲它似乎我永遠不會得到它？

在此先感謝您的幫助 - 我只是儘可能多地學習。

Answer 1

我會分階段打破這個，你需要添加一個「保存」視圖取決於你想要的地方。

斯科特

<form action="/Demo01/Create" method="post"> 
Number of Exercises: 
<%= Html.TextBox("tbxNumberOfExercises") %> 
<br /> 
<br /> 
<input type="submit" value="Set Exercise Number" /> 
</form> 
<% if (ViewData["number"] != null) {%> 
<form action="/Demo01/Save" method="post"> 
There are this many:<%=Html.Encode(ViewData["number"])%> 
<br /> 
and this line should show up 
<% if (ViewData["number"] != null) { 
     int max = (int)ViewData["number"]; 

     for (int i = 0; i < max; i++) {%> 
<br /> 
<br /> 
<%= Html.TextBox("tbox_exercise" + i) %> 
<% } 
    } %> 
<% if (ViewData["s"] != null) %> 
<%=Html.Encode(ViewData["s"]) %> 
<input type="submit" value="Save Exercises" /> 
<% } %> 
</form> 

然後在你的控制器是這樣的：

public class Demo01Controller : Controller { 
    public ActionResult Create() { 
     return View(); 
    } 

    [AcceptVerbsAttribute("POST")] 
    public ActionResult Create(int tbxNumberOfExercises) { 
     ViewData["number"] = tbxNumberOfExercises; 
     return View("Create"); 
    } 

    [AcceptVerbs(HttpVerbs.Post)] 
    public ActionResult Save() { 
     foreach (var key in Request.Form.Keys) { 
      string keyString = key.ToString(); 
      if (keyString.StartsWith("tbox_exercise", StringComparison.OrdinalIgnoreCase)) { 
       string recNum = keyString.Substring(13, keyString.Length - 13); 
       string approvedKey = Request.Form["tbox_exercise" + recNum]; 
       int number; 
       int.TryParse(approvedKey, out number); 
      } 
     } 
     return View(); // return/redirect to wherever you want 
    } 
} 

Answer 2

的問題是，你的</form>結束標記需要付出您的視圖的結尾。

試試這個修改後的視圖：

<form action="/CreateWorkout/Create" method="post"> 
Number of Exercises: 
<%= Html.TextBox("tbxNumberOfExercises") %> 
<br /> 
<br /> 
<input type="submit" value="Set Exercise Number" /> 
<% if (ViewData["number"] != null)%> 
There are this many:<%=Html.Encode(ViewData["number"])%> 
<br /> 
and this line should show up 
<% if (ViewData["number"] != null) 
    { 
     int max = (int)ViewData["number"]; 

     for (int i = 0; i < max; i++) 
     {%> 
      <br /> 
      <br /> 
      <%= Html.TextBox("tbox_exercise" + i) %> 
    <% } 
    } %> 
<% if (ViewData["s"] != null) %> 
<%=Html.Encode(ViewData["s"]) %> 
</form> 

我會盡可能最佳實踐建議斯科特的做法。這個答案是關於讓你的確切場景工作。

Answer 3

我會考慮通過javascript添加文本框客戶端，而不是回發到服務器以重繪表單，假設您可以使用JavaScript作爲使用該應用程序的要求。如果沒有，那麼@斯科特的方法應該工作。作爲一個偏好問題，我可能會使用Save方法獲取FormCollection參數，而不是直接處理Request對象。

JavaScript的解決方案將是有一個單一的文本框和一個按鈕來添加另一個。用戶可以繼續添加文本框直到他們有足夠的空間。

Answer 4

感謝您的幫助球員。我今天早上5點才意識到，我的問題是該表單沒有包含新的文本框/我需要另一個表單。我將不得不認真研究Javascript並實際修改DOM，因爲保留它在客戶端會更好。

非常感謝。