如何在MVC3中爲多行文本框創建多個編輯器模板？

我有以下兩種類型的多文本域在我的觀點：如何在MVC3中爲多行文本框創建多個編輯器模板？

<textarea cols="100" rows="15" class="full-width" id="dialogText" 
      name="Text">@Model.Text</textarea> 

<textarea cols="100" rows="10" class="full-width" id="dialogText" 
      name="Text">@Model.Text</textarea>

我想借的自定義編輯模板的優勢，但要以不同的方式指定屬性的能力（例如，rows兩者之間的不同以上）。

是否可以爲同一字段聲明和使用兩種不同的模板？如果是這樣，那麼我應該如何聲明模板，以及如何指定要使用的不同模板？

另外我怎樣才能聲明不同的列和行。我可以使用cols，rows還是應該指定CSS的高度和寬度，例如width=500px, height=600px或400px？

來源

2012-05-22 Samantha J T Star

您可以覆蓋default editor template（~/Views/Shared/EditorTemplates/MultilineText.cshtml）：

@Html.TextArea(
    "", 
    ViewData.TemplateInfo.FormattedModelValue.ToString(), 
    ViewData 
)

，然後假設你已經定義的視圖模型：

public class MyViewModel 
{ 
    [DataType(DataType.MultilineText)] 
    public string Text { get; set; } 
}

主視圖裏面你可以這樣做：

@model MyViewModel 

@Html.EditorFor(x => x.Text, new { cols = "100", rows = "15", id = "dialogText", @class = "full-width" }) 
@Html.EditorFor(x => x.Text, new { cols = "100", rows = "10", id = "dialogText", @class = "full-width" })

這將呈現預期的輸出：

<textarea class="full-width" cols="100" id="dialogText" name="Text" rows="15"> 
    hello world 
</textarea> 

<textarea class="full-width" cols="100" id="dialogText" name="Text" rows="10"> 
    hello world 
</textarea>

而且你可以提高編輯模板，這樣你就不需要在每個指定@class屬性EditorFor這樣調用：

@{ 
    var htmlAttributes = ViewData; 
    htmlAttributes["class"] = "full-width"; 

} 
@Html.TextArea(
    "", 
    ViewData.TemplateInfo.FormattedModelValue.ToString(), 
    htmlAttributes 
)

，現在你可以：

@model MyViewModel 
@Html.EditorFor(x => x.Text, new { cols = "100", rows = "15", id = "dialogText" }) 
@Html.EditorFor(x => x.Text, new { cols = "100", rows = "10", id = "dialogText" })

哦，不要忘了，ID必須是唯一的HTML，所以這id = "dialogText"顯然應該是不同的第二個textarea。

來源

2012-05-22 06:13:25

謝謝Darin。當我有機會對其進行測試時，我會審查並測試您所說的所有內容並標記爲已回答。一如既往，你的回答非常詳細。只是一個簡單的問題。你認爲可以使用cols和rows，或者我應該在px中指定寬度。如果是px，那我該怎麼做？ –

兩者都是可能的。我不是CSS專家，但我從我的朋友設計師那裏聽說他們更喜歡使用CSS來實現這一點。所以使用樣式屬性：'@ Html.EditorFor（x => x.Text，new {style =「width：100px; height：50px;」}）''。或者應用預定義的CSS類。 –

該解決方案直到版本6纔有可能。https://github.com/aspnet/Mvc/issues/965 –

您可以創建一個編輯器模板MultiLine1.cshtml和MultiLine2.cshtml，在您的視圖模型中，您可以使用UIHint來指定您要用於該特定屬性的編輯器模板。但是，您只能爲一個屬性指定一個模板。在同一類型的不同屬性上，可以使用不同的模板。

來源

2012-05-22 06:04:40

如何在MVC3中爲多行文本框創建多個編輯器模板？

回答

相關問題