處理某些形式元素構建對象

Question

所有，

我有一個形式，其中用戶可以動態地添加的元素的部分。他們可以一次添加包含3個輸入字段的行。請注意，我沒有將這些動態元素綁定到模型 - 我將在HTTP POST處理控制器中進行處理。

每個增加的行代表一個聯合贊助對象，將需要在用於HTTP POST的 形式處理控制器作用被創建並隨後被插入到數據庫中。

我想知道什麼是命名這些元素的最佳方式，以便我可以輕鬆地在處理控制器中創建對象？

目前，該元素被命名爲這樣的：

cosponsorcontact_1 
cosponsoremail_1 
cosponsorphone_1 

cosponsorcontact_2 
cosponsoremail_2 
cosponsorphone_2 

cosponsorcontact_4 
cosponsoremail_4 
cosponsorphone_4 

cosponsorcontact_n 
cosponsoremail_n 
cosponsorphone_n 

這將涉及大量的regexing和循環，從而把這些重新走到一起，從而創建對象。我假定這些元素可能以隨機順序位於Request.Form集合中，並且我們可能沒有順序編號的id，如上例所示。

我當然可以這樣做，但我相信必須有一種更簡單的方法，或許在表單元素的命名約定中？

這裏是生成的表單內容的一個片段：

<div id="cosponsors_6" style="display: block;"> 
    <label>Sponsor club name</label></span> 
    <input type="text" title="Co-sponsor contact" placeholder="Name" name="cosponsorcontact_6" id="cosponsorcontact_6"> 
    <input type="text" title="Co-sponsor email" placeholder="Email" name="cosponsoremail_6" id="cosponsoremail_6"> 
    <input type="text" title="Co-sponsor phone" placeholder="Phone" name="cosponsorphone_6" id="cosponsorphone_6"><a class="icon delete"></a> 
</div> 
<div id="cosponsors_7" style="display: block;"> 
    <label>Sponsor club name</label></span> 
    <input type="text" title="Co-sponsor contact" placeholder="Name" name="cosponsorcontact_7" id="cosponsorcontact_7"> 
    <input type="text" title="Co-sponsor email" placeholder="Email" name="cosponsoremail_7" id="cosponsoremail_7"> 
    <input type="text" title="Co-sponsor phone" placeholder="Phone" name="cosponsorphone_7" id="cosponsorphone_7"><a class="icon delete"></a>< 
</div> 
<div id="cosponsors_8" style="display: block;"> 
    <label>Sponsor club name</label></span> 
    <input type="text" title="Co-sponsor contact" placeholder="Name" name="cosponsorcontact_8" id="cosponsorcontact_8"> 
    <input type="text" title="Co-sponsor email" placeholder="Email" name="cosponsoremail_8" id="cosponsoremail_8"> 
    <input type="text" title="Co-sponsor phone" placeholder="Phone" name="cosponsorphone_8" id="cosponsorphone_8"><a class="icon delete"></a> 
</div> 
<div id="cosponsors_9" style="display: block;"> 
    <label>Sponsor club name</label></span> 
    <input type="text" title="Co-sponsor contact" placeholder="Name" name="cosponsorcontact_9" id="cosponsorcontact_9"> 
    <input type="text" title="Co-sponsor email" placeholder="Email" name="cosponsoremail_9" id="cosponsoremail_9"> 
    <input type="text" title="Co-sponsor phone" placeholder="Phone" name="cosponsorphone_9" id="cosponsorphone_9"><a class="icon delete"></a> 
</div> 

Answer 1

Phil Haack's article on model binding to a list佔地面積回發非順序列表項。

<input type="hidden" name="cosponsorContacts.Index" value="3" /> 
<input type="text" name="cosponsorContacts[3].contact" value="Whatever" /> 
<input type="text" name="cosponsorContacts[3].email" value="Here" /> 
<input type="text" name="cosponsorContacts[3].phone" value="Digits" /> 

<input type="hidden" name="cosponsorContacts.Index" value="7" /> 
<input type="text" name="cosponsorContacts[7].contact" value="One" /> 
<input type="text" name="cosponsorContacts[7].email" value="Two" /> 
<input type="text" name="cosponsorContacts[7].phone" value="Three/> 

Answer 2

更新...

在這裏，我的回答是不是對這個問題相當合適，但對於未來的讀者着想，我想我應該引用此clean, concise solution，可以很容易地擴展爲使用AJAX動態添加編輯器模板視圖。

Original post ...

假設你正在試圖獲得這些元素綁定到裏面，你的行動期待一些視圖模型的ICollection屬性，然後在輸入字段的命名約定將類似於：

id="ViewModelProperty_0__ObjectProperty" name="ViewModelProperty[0].ObjectProperty" 
id="ViewModelProperty_1__ObjectProperty" name="ViewModelProperty[1].ObjectProperty" 
id="ViewModelProperty_n__ObjectProperty" name="ViewModelProperty[n].ObjectProperty" 

換句話說，試圖用你的例子，如果你的動作看起來是這樣的：

[HttpPost] 
public ActionResult Save(SponsorsEditViewModel postData) { ... 

而且你的類的樣子：

public class SponsorViewModel { 
    public String CoSponsorName { get; set; } 
    public String CosponserEmail { get; set; } 
    ... 
} 

public class SponsorsEditViewModel { 
    public ICollection<SponsorViewModel> Sponsors { get; set; } 
    ... 
} 

然後你輸入字段應該結束了命名如下：

<input id="Sponsors_0__CoSponsorName" name="Sponsors[0].CoSponsorName" ... 
<input id="Sponsors_0__CoSponsorEmail" name="Sponsors[0].CoSponsorEmail" ... 

<input id="Sponsors_1__CoSponsorName" name="Sponsors[1].CoSponsorName" ... 
<input id="Sponsors_1__CoSponsorEmail" name="Sponsors[1].CoSponsorEmail" ... 

... 

<input id="Sponsors_n__CoSponsorName" name="Sponsors[n].CoSponsorName" ... 
<input id="Sponsors_n__CoSponsorEmail" name="Sponsors[n].CoSponsorEmail" ... 

注意，我們使用的ICollection，而不是因爲IEnumerable的IEnumerable是隻讀的。綁定會失敗。

另外，我似乎記得，如果序列被破壞（即跳過一個數字），那麼跳過後的任何內容都不會被綁定。

當然，MVC3可以爲您自動生成所有這些，但在這種情況下，您將動態生成這些新字段。

請注意，如果你不熟悉它們，請看editor templates。

希望這會有所幫助。

未來讀者附錄...請注意，我的解決方案在這裏不會解決無序編號的處理問題。