[ASP Net MVC] 透過DisplayName屬性標籤呈現List資料表頭名稱

透過Display屬性標籤呈現表頭名稱

前言

 

使用Asp.Net MVC進行開發,當我們需要從ViewModel取出多筆資料(List)呈現於Table中,且希望表頭欄位的名稱依據ViewModel對於該屬性DisplayName標籤呈現時,可以透過以下方式來取得。

 

@Html.DisplayNameFor(model => model.Users.First().Email)

 

有些人可能會有些疑慮,覺得是否會在沒有任何資料的情況下產生錯誤? 仔細探究一下原理發現,View不會真的去執行First()這個動作,而是依循著參考取得Email的MetaData來進行顯示,所以有沒有資料都不會影響表頭名稱的呈現喔。

 

 

實際演練

 

ViewModel


public class UserIndexViewModel
    {
    	// Properties
        public List<UserModel> Users { get; set; }

        public string SomeInfoHere { get; set;}
    
    
    	// Class
        public sealed class UserModel
        {

            // Properties
            [DisplayName("User Id")]
            public string UserId { get; set; }

            [DisplayName("Email")]
            public string Email { get; set; }

            [DisplayName("Name")]
            public string Name { get; set; }

            [DisplayName("Enable")]
            public bool IsEnable { get; set; }

            [DisplayName("Register Date")]
            public DateTime RegisterOn { get; set; }

        }
    }

 

View


@model TP.Pilot.Web.ViewModels.UserIndexViewModel

<table class="table">
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.Users.First().Email)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Users.First().Name)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Users.First().RegisterOn)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Users.First().IsEnable)
        </th>
        <th></th>
    </tr>

	@foreach (var item in Model.Users) {
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.Email)
        </td>

        <td>
            @Html.DisplayFor(modelItem => item.Name)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.RegisterOn)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.IsEnable)
        </td>
    </tr>
	}

</table>

Result

image


希望此篇文章可以幫助到需要的人

若內容有誤或有其他建議請不吝留言給筆者喔 !