カスタム検証エラーメッセージの場所

Question

私のニーズに合わせて以下を変更する方法に苦労しました。これは、私が単純な入力で持っているフォーム用です。現在のコードは、ラベル、フィールド、および検証メッセージを垂直方向に表示するだけですが、水平方向にしたい（<table>を使用）。

現在、私はこのコードを持っている：

var wrapper = new TagBuilder("div"); 
wrapper.AddCssClass("field-wrapper"); 

var table = new TagBuilder("table");//This is my test to insert a table 

var label = new TagBuilder("div"); 
label.AddCssClass("field-label"); 
if (metadata.IsRequired && !metadata.IsReadOnly) 
    { 
     if (metadata.ModelType != typeof (bool)) 
     { 
      label.InnerHtml += "* "; 
      wrapper.AddCssClass("required"); 
     } 
    } 

label.InnerHtml += html.LabelFor(expression); 
wrapper.InnerHtml += label; 

var input = new TagBuilder("div"); 
input.AddCssClass("field-input"); 
input.InnerHtml += html.EditorFor(expression); 

if (!string.IsNullOrEmpty(metadata.Description)) 
    { 
     input.InnerHtml += html.TooltipFor(expression);//declared elsewhere to show a tooltip 
    } 

input.InnerHtml += html.ValidationMessageFor(expression); 

wrapper.InnerHtml += input; 
wrapper.InnerHtml += table;//This is my test to insert a table 
return MvcHtmlString.Create(wrapper + "\r\n"); 

私は<table>を挿入しようとしたが、これはそのコードとHTMLの構造である：

<div class="field-wrapper"> 
    <div class="field-label"> 
     <label for="Name">Name</label> 
    </div> 
    <div class="field-input"> 
     * <input class="text-box single-line input-validation-error" data-val="true" data-val-required="The Name field is required." id="Name" name="Name" type="text" value=""> 
     <!--tooltip would ordinarily show up here--> 
     <span class="field-validation-error" data-valmsg-for="Name" data-valmsg-replace="true"> 
      <span for="Name" generated="true" class="">The Name field is required.</span> 
     </span> 
    </div> 
    <table></table><!--This is my table--> 
</div> 

これは、それがvalidation-後に次のようになりますエラー：

私は何のために行くのですが、この構造体である：

物事のカップルは注意する：

<div class="field-wrapper"> 
    <table border="0"> 
     <tbody> 
      <tr> 
       <td width="40%"> 
        <div class="field-label"> 
         <label class="mylabelstyle" for="FirstName" title="Enter first name.">First Name:</label> 
        </div> 
       </td> 
       <td width="60%"> 
        <div class="field-input"> 
         <input data-val="true" data-val-required="First Name required." id="FirstName" name="FirstName" type="text" value="" /> 
         <!--tooltip here as necessary--> 
         <span class="field-validation-valid" data-valmsg-for="FirstName" data-valmsg-replace="true"></span> 
        </div> 
       </td> 
       </tr> 
      </tbody> 
    </table> 
</div> 

視覚的に、これは私が何をした後で

1. を「* "（必須コード）とツールチップは、特定の条件下で表示されます。
2. スタイリングは問題ありません - ここでは構造に焦点を当てています。
3. 私は入力のために異なるヘルパーを使用しました。したがって、それぞれの内部のコード（および名前、つまり名前v。ファーストネーム）は異なり、問題ではありません。
4. <table>は、左に浮いた<div>の中にあります。私は問題ではない（それは第2の画像の検証の下に現れる）いくつかの静的コンテンツを右側に有しているので、それも重要ではない。

私はTagBuilderでうまくやっておらず、すべてを混乱させています。どんな助けでも大歓迎です。ありがとう！そこ

Answer 1

あなたが行く：

public static IHtmlString MyEditorFor<TModel, TProperty>(
    this HtmlHelper<TModel> html, 
    Expression<Func<TModel, TProperty>> expression 
) 
{ 
    var metadata = ModelMetadata.FromLambdaExpression<TModel, TProperty>(expression, html.ViewData); 

    var wrapper = new TagBuilder("div"); 
    wrapper.AddCssClass("field-wrapper"); 
    var table = new TagBuilder("table"); 
    table.Attributes["border"] = "0"; 
    var tbody = new TagBuilder("tbody"); 
    var tr = new TagBuilder("tr"); 
    var td1 = new TagBuilder("td"); 
    td1.Attributes["width"] = "40%"; 
    var label = new TagBuilder("div"); 
    label.AddCssClass("field-label"); 
    if (metadata.IsRequired && !metadata.IsReadOnly) 
    { 
     if (metadata.ModelType != typeof(bool)) 
     { 
      label.InnerHtml += "* "; 
      wrapper.AddCssClass("required"); 
     } 
    } 
    label.InnerHtml += html.LabelFor(expression); 
    td1.InnerHtml = label.ToString(); 
    var td2 = new TagBuilder("td"); 
    td2.Attributes["width"] = "60%"; 
    var input = new TagBuilder("div"); 
    input.AddCssClass("field-input"); 
    input.InnerHtml += html.EditorFor(expression); 

    if (!string.IsNullOrEmpty(metadata.Description)) 
    { 
     input.InnerHtml += html.TooltipFor(expression); 
    } 
    input.InnerHtml += html.ValidationMessageFor(expression); 
    td2.InnerHtml = input.ToString(); 
    tr.InnerHtml = td1.ToString() + td2.ToString(); 
    tbody.InnerHtml = tr.ToString(); 
    table.InnerHtml = tbody.ToString(); 
    wrapper.InnerHtml = table.ToString(); 
    return new HtmlString(wrapper + Environment.NewLine); 
}