請問如何將c#取到的變數塞入html表格中 ?

c# html

joy036 2023-03-30 15:22:44 ‧ 1702 瀏覽

分享至

請問各位大大,

想使用c#寫網頁，但顯示格式希望以HTML TABLE來顯示。
請問如何讓aspx.cs與html產生關聯。

programlin iT邦新手 5 級 ‧ 2023-03-31 07:38:46 檢舉

在 ASP.NET Web Forms 中，可以使用 ASP.NET Server Controls 和 HTML 控制項來建立網頁。ASP.NET Server Controls 是一組在伺服器端執行的控制項，它們可以以程式碼方式建立、修改、存取和渲染 HTML 元素。

要在 C# 中使用 HTML TABLE，你可以使用 ASP.NET Server Controls 中的 GridView 控制項。以下是一個簡單的範例：

在 aspx 檔案中，使用以下代碼建立一個 GridView 控制項：

```
<asp:GridView ID="MyGridView" runat="server">
</asp:GridView>
```

在 aspx.cs 檔案中，使用以下代碼設定 GridView 的資料來源：

```
protected void Page_Load(object sender, EventArgs e)
{
// 建立 DataTable 物件
DataTable dt = new DataTable();

// 新增資料行
dt.Columns.Add("Name", typeof(string));
dt.Columns.Add("Age", typeof(int));
dt.Columns.Add("City", typeof(string));

// 新增資料列
dt.Rows.Add("Alice", 25, "New York");
dt.Rows.Add("Bob", 30, "London");
dt.Rows.Add("Charlie", 35, "Paris");

// 設定 GridView 的資料來源
MyGridView.DataSource = dt;
MyGridView.DataBind();
}
```

執行網頁，GridView 將顯示一個包含三列資料的 HTML TABLE。
在這個範例中，我們使用 DataTable 物件建立一個包含三列資料的資料表，並將它設定為 GridView 的資料來源。當網頁載入時，GridView 將會自動渲染一個 HTML TABLE，顯示這些資料。

當然，這只是一個簡單的範例。如果你需要更複雜的 HTML TABLE，你可以使用 GridView 的屬性和事件來自定義控制項的外觀和行為。另外，你也可以使用其他 ASP.NET Server Controls 和 HTML 控制項來建立網頁，以滿足你的需求。

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

2 個回答

kw6732

iT邦研究生 4 級 ‧ 2023-03-30 16:12:58

這件事情現在有好多種版本可以說明，以你所提的應該是在 .Net Framework內的 Web Form，要產生關聯的方法如下。

檔案：purchases.aspx 內第一句 CodeFile 這屬性所設定。

<%@ Page Title="採購單" Language="C#" MasterPageFile="~/Master.master" AutoEventWireup="true" EnableEventValidation="false" CodeFile="purchases.aspx.cs" Inherits="admin_purchases" MaintainScrollPositionOnPostback="true" %>

HTML TABLE部分就看你怎麼用後台的資料去塞，或者直接使用GridView物件去入資料也可以。

具體CS程式碼如下：

// 創建一個GridView控件
GridView gridView = new GridView();

// 設置控件的DataSource屬性，用於綁定數據
List<MyData> myDataList = GetDataFromDatabase();
gridView.DataSource = myDataList;

// 創建一個BoundField列，用於顯示名字
BoundField nameField = new BoundField();
nameField.DataField = "Name";
nameField.HeaderText = "Name";
gridView.Columns.Add(nameField);

// 創建一個BoundField列，用於顯示年齡
BoundField ageField = new BoundField();
ageField.DataField = "Age";
ageField.HeaderText = "Age";
gridView.Columns.Add(ageField);

// 添加GridView控件到ASPX頁面上
myDiv.Controls.Add(gridView);

具體Aspx程式碼(前端)如下：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication1._Default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>My Page</title>
</head>
<body>
    <form id="form1" runat="server">
        <div id="myDiv" runat="server">
            
        </div>
    </form>
</body>
</html>

參考資料：
@Page

GridView

回應
分享
檢舉

登入發表回應

Juro十六

iT邦新手 3 級 ‧ 2023-03-30 16:23:05

MVC的話
Controllers
用ViewBag.list_name = List<list_name>或是直接return View(list_name)過去
前者的話在前端用
List<list_name> list_name = ViewBag.list_name
後者的話
@model List<list_name>
下方用@foreach(var list in list_name)的方式把資料迴圈進去