[ASP.NET MVC] @Html.TextArea() 、@Html.TextAreaFor() 和 <textarea>

-

產生 <textarea> 標籤用的是 @Html.TextArea() 方法，TextArea() 很像 TextBox()。第一個引數是字串，做為 id 和 name ：

  @Html.TextArea("comment")

  // 會產生：

  <textarea cols="20" id="comment" name="comment" rows="2"></textarea>

會預設有一個適當大小，row="2" col="20，下面會示範還可以調整。若使用第二個引數可用字串填入預設文字，也就是前後標籤包起來的內容：

  @Html.TextArea("comment"
                 , "很好吃" )

  // 會產生：

  <textarea cols="20" id="comment" name="comment" rows="2">很好吃</textarea>

或是用第二個引數帶入 HTML 屬性，使用匿名類別 new { } ：

  @Html.TextArea("comment"
                 , new { placeholder = "請留下您的評價" } )

  // 會產生：

  <textarea cols="20" id="comment" name="comment" placeholder="請留下您的評價" rows="2"></textarea>

使用三個引數可一次帶入已填入文字和 HTML 屬性，例如：

  @Html.TextArea("comment"
                 , "氣氛不錯"
                 , new { style = "background-color: lightyellow; width: 80%; " } )

  // 會產生：

  <textarea cols="20" id="comment" name="comment" rows="2" style="background-color: lightyellow; width: 80%;">氣氛不錯</textarea>

五個引數可指定列數與行數（先 row 再 column）：

  @Html.TextArea("comment"
                 , "氣氛不錯"
                 , 5        // row
                 , 30       // col
                 , new { onmouseover = "changeBgColor()" } )

  // 會產生：

  <textarea cols="30" id="comment" name="comment" onmouseover="changeBgColor()" rows="5">氣氛不錯</textarea>

另外有強型別的 TextAreaFor() 方法讓繫結的 Model 更快速產生，在 Controller 有帶入 Employee 物件到 View：

  Employee newEmployee = new Employee();
  return View(newEmployee);     // 傳到 View
在 View 中可用 lambda expression 快速繫結： 
  @model prjMvc.Models.Employee
  
  @Html.TextArea(m => m.Note)

  // 會產生：

  <textarea cols="20" id="Note" name="Note" rows="2"></textarea>    // 屬性名自動繫結

也可以指定 row、col 和帶入 HTML 屬性。

留言

張貼留言