ASP.NET MVC 中有一些常用的視圖引擎,這裡做個整理列表。

以下命名空間 System.Web.Mvc.Html 中:

FormExtensions類

1.BeginForm() :產生form開始標籤 。13個Overloading

2.BeginRouteForm() :根據URL路由規則指定路徑的form標籤。12個Overloading

3.EndForm() :產生form結束標籤。

可直接寫成:

  Razor: @{ using ( Html.BeginForm( ... ) ) }  

  Render: <form action="/" method="post"> ... </form>

InputExtensions類

1. CheckBox() , CheckBoxFor() : 產生多選項input tag。6個Overloading , 3個Overloading

Razor:

    @Html.CheckBox( "CheckBox1" , true , new { id="checkbox" } )

Render:

    <input checked="checked" id="checkbox" name="CheckBox1" type="checkbox" value="true" />

    <input name="CheckBox1" type="hidden" value="false" />

2. Hidden() , HiddenFor() : 產生隱藏tag。4個Overloading , 3個Overloading

Razor :

  @Html.Hidden( "Hidden1" , "Hidden Value")

Render:

  <input id="Hidden1" name="Hidden1" type="hidden" value="Hidden Value" />

3.Password() , PasswordFor() :  產生密碼類型的input tag 。 4個Overloading  3個Overloading

Razor :

  @Html.Password ( "Password1" , 12345678)

Render :

  <input id="Password1" name="Password1" type="password" value="12345678" />

4.RadioButton() , RadioButtonFor() : 產生單選項input tag。 6個Overloading  3個Overloading

Razor :

  @Html.RadioButton ( "RadioButton1" , "RadioValue" , true)

Render :

  <input checked="checked" id="RadioButton1" name="RadioButton1" type="radio" value="RadioValue" />

5.TextBox() , TextBoxFor(): 產生 文字輸入框 input tag 。  4個Overloading  3個Overloading 

Razor:

  @Html.RadioButton ( "TextBox1" , "TextValue" new { maxlength = 3 })

Render:

  <input id="TextBox1" maxlength="3" name="TextBox1" type="Text" value="TextValue" />

LinkExtensions類

1. ActionLink(): 產生 超鏈結 tag 。 10個Overloading

Razor:

  @Html.ActionLink ( "Home Index" , "New" , "Home" )

Render:

  <a href="/Home/New">Home Index</a>

2. RouteLink(): 可以根據Route規則產生 超鏈結tag 。 11個Overloading

Razor:

  @Html.RouteLink( "NewLink" , new { controller="Home" , action="New"} )

Render:

  <a href="/Home/New">NewLink</a>

RenderPartialExtensions類

1. RenderPartial() :轉譯部分視圖。 4個Overloading 

SelectExtensions類

1. DropDownList() , DropDownListFor() :產生下拉式 tag 8個Overloading  , 6個Overloading

Razor:

  @HtmlDropDownList("List" , new SelectList( new int{ 2, 4, 6, 3, 2 }))

Render:

  <select id="List" name="List">

    <option>2</option>

    <option>4</option>

    <option>6</option>

    <option>3</option>

    <option>2</option>

  </select>

2. ListBox() , ListBoxFor() :產生列表清單tag 4個Overloading  3個Overloading

Razor:

  @Html.ListBox ("List" , new SelectList(new string[]{ "aaa" , "bbb" , "ccc" ,"ddd"}))

Render:

  <select id="List" multiple="multiple" name="List">

    <option>aaa</option>

    <option>bbb</option>

    <option>ccc</option>

    <option>ddd</option>

   </select>

TextAreaExtensions類

1. TextArea() , TextAreaFor()  : 產生豐富內容輸入tag  8個Overloading  5個Overloading

Razor:

  @Html.TextArea( "TextArea1" , "<h1>標題</h1><p>內容</p>",3,50, new { style = "border: solid 1px #ccc;" })

Render:

  <textarea cols="50" id="TextArea1" name="TextArea1" rows="3" style="border:solid 1px #ccc;">

    &lt;h1&gt;標題&lt;/h1&gt;&lt;p&gt;內容&lt;/p&gt;

  </textarea>

ValidationExtensions類

1. ValidationMessage() , ValidationMessageFor() :  顯示ModelState字典中存在的錯誤訊息。 6個Overloading  4個Overloading

  Public ActionResult Index()

  {

      var ms = new ModelState();

      ms.Errors.Add("ErrorMessage.");

      ModelState["Err"] = ms;

      return View();

  }

Razor:

  @Html.ValidationMessage("Err")

Render:

  <span class="fidld-validation-error">ErrorMessage.</span>

2. ValidationSummary() : 顯示ModelState 字典所有確認錯的未經排序的列表。 8個Overloading

  Public ActionResult Index()

  {

      var modelState = new ModelState();

      modelState.Errors.Add("LoginName Error.");

      ModelState["LoginName"] = modelState;

      modelState = new ModelState();

      modelState.Errors.Add("Password Error.");

      ModelState["Password"] = modelState;

      return View();

  }

Razor:

  @Html.ValidationMessage("LoginName")

  @Html.ValidationMessage("Password")

  @Html.ValidationSummary("This is Title")

Render:

  <span class="fidld-validation-error">LoginName Error.</span>

  <span class="fidld-validation-error">Password Error.</span>

  <div class="validation-summary-errors">

     <span>This is Title</span>

     <ul>

         <li>LoginName Error.</li>

         <li>Password Error.</li>

     </ul>

  </div>

arrow
arrow

    Jimmy 發表在 痞客邦 留言(0) 人氣()