[ASP.NET MVC] @Html.BeginForm() 和 <form>

-

要產生 <form> 要使用 @Html.BeginForm() 方法，不過不能單獨呼叫，因為 <form> 要有 </form> ，所以要利用 @using() { } 包住。下面舉例，在 Home Controller 裡寫一個 Action 叫 Create ：

  public ActionResult Create()
  {
    return View();
  }

在 Create 的 View 中，如下使用 BeginForm() 方法：

  @using(Html.BeginForm())
  {
  
  }
  
  // 會產生：
  
  <form action="/Home/Create" method="post"></form>

會發現 action 屬性已自動填上本身 Action 的位址，而且 method 自動使用 Post，這些是 BeginForm() 預設的選項，也可以更改：

  @using(Html.BeginForm("CreateDetail"        // 目標 Action
                         , "Order"            // 目標 Controll
                         , FormMethod.Get))   // 使用 method 方法
  {
    
  }
  
  // 會產生：
  
  <form action="/Order/CreateDetail" method="get"><form>

如上，action URL 會更改，且 method 也改成使用 Get 方法。

也可以用五個引數，在第三個引數帶入 route value ，第五個引數帶入 HTML Attribute，都是使用匿名類別帶入，如下：

  @using(Html.BeginForm("CreateDetail"
                         , "Order"
                         , new { CreateTime = DateTime.Now }
                         , FormMethod.Post
                         , new { name = "detailInfo" } ) )
  {
    <div>
      @Html.TextBox("Name")
    </div>
    <div>
      @Html.TextBox("Price", 0, new { type = "number" } )
    </div>
    @Html.TextBox("send", "送出", new { type = "submit" } )
  }
  
  // 會產生：
  
  <form action="/Order/CreateDetail?CreateTime=...進入View的時間..." method="post" name="detailInfo">
    <div>
      <input id="Name" name="Name" type="text" value="" />
    </div>
    <div>
      <input id="Price" name="Price" type="number" value="0" />
    </div>
    <input id="send" name="send" type="submit" value="送出" />
  </form>

Route value 可以攜帶固定的資料去後端，如果 AJAX 使用 formData 傳輸這個表單，就需要 <form> 的 name 屬性，這兩個其實使用機會不多，比較常見是傳送非純文字資料（例如圖片）時會使用 new { enctype = "multipart/form-data" }。

因為預設使用 Post 方法，而且會傳到與 View 同名的 Action，故通常都使用 @using(Html.BeginForm()) { ... } 即可。

留言

張貼留言