ASP.NET 前台調用後台方法實戰：DataList 模板欄位內嵌 C# 函數呼叫與資料綁定運算式

場景：DataList/Repeater/GridView 模板中需動態生成連結或文字

資料繫結控件的 `` 中，常需根據多個欄位組合顯示內容 (如：標題 + [語言版本])。ASP.NET 提供 **資料繫結運算式 `<%# %>`** 直接呼叫後台 `protected/public` 方法。

完整範例

1. ASPX 標記

<asp:DataList ID="dlstCon" runat="server" RepeatDirection="Horizontal" RepeatLayout="Flow">
    <ItemTemplate>
        <li>
            <a href='<%# "ShowList.aspx?ExhibitionID=" + Eval("ExhibitionID") %>'
               title='<%# GetTooltip(Eval("Title"), Eval("TitleValue")) %>'
            >
                <%# Eval("Title") %>
            </a>
        </li>
    </ItemTemplate>
</asp:DataList>

2. Code-behind (C#)

public partial class ExhibitionList : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            // 模擬資料來源
            var data = new[]
            {
                new { ExhibitionID = 1, Title = "台北國際書展", TitleValue = "ZH-TW" },
                new { ExhibitionID = 2, Title = "Tokyo Book Fair", TitleValue = "JA-JP" },
                new { ExhibitionID = 3, Title = "Seoul Book Fair", TitleValue = "" } // 無語言版本
            };
            dlstCon.DataSource = data;
            dlstCon.DataBind();
        }
    }

    /// 

    /// 供前台 <%# %> 呼叫：組合工具提示文字
    /// 
    protected string GetTooltip(object titleObj, object titleValueObj)
    {
        string title = titleObj?.ToString() ?? "";
        string value = titleValueObj?.ToString() ?? "";

        if (!string.IsNullOrEmpty(value) && value != "Null")
            return $"{title} [{value}]";
        return title;
    }
}

關鍵語法解析

進階技巧

1. 方法回傳複雜物件，前台取屬性

// 後台
protected MyDto GetDetail(int id) => Service.Get(id);

// 前台
<%# GetDetail((int)Eval("Id")).Description %>

2. 條件式顯示 HTML 區塊

<%# (bool)Eval("HasDiscount") ? $"<span class='badge'>{Eval("DiscountPct")}% OFF</span>" : "" %>

3. 格式化日期/數字

<%# ((DateTime)Eval("CreateTime")).ToString("yyyy/MM/dd HH:mm") %>
<%# string.Format("{0:C0}", Eval("Price")) %>

4. 避免 Null 參考例外

<%# (Eval("OptionalField") ?? "預設值").ToString() %>
<%# Eval("OptionalField")?.ToString() ?? "預設值" %>  

效能與架構考量

• 優點：邏輯集中在 Code-behind，前台標記乾淨，享有 IntelliSense、編譯檢查、單元測試。
• 缺點：每個資料列呼叫一次方法，大量資料 (＞1000 列) 可能影響繫結速度。可改用 `<%# ... %>` 內直接運算或預先在資料層組裝 ViewModel。
• 不可用於靜態 HTML 控件：`
  ` 無效，必須是 `runat="server"` 控件屬性或模板內容。

常見錯誤

1. 方法非 protected/public：私有方法前台無法存取。
2. Eval 回傳 object 需轉型：`(int)Eval("Id")`、`(DateTime)Eval("Date")`。
3. 方法拋出例外導致整頁繫結失敗：方法內部需 `try-catch` 回傳預設值。
4. 巢狀資料繫結控件：內層 `Eval` 只能看到內層 `Container.DataItem`，外層欄位需用 `((OuterType)Container.Parent.Parent.DataItem).Field`。

總結

`<%# Method(...) %>` 是 ASP.NET WebForms **分離關注點** 的關鍵技術：前台負責呈現結構，後台負責格式化邏輯。善用此機制，配合 `Eval`/`Bind`、條件運算式、格式化字串，即可在保持標記乾淨的同時實現複雜的動態 UI 生成。大量資料場景建議在資料存取層預先計算好顯示欄位，減少繫結期運算。