使用復雜物件的嵌套asp中繼器

我有一個復雜的物件，其中包含需要系結到轉發器/顯示在表格中的嵌套物件集合。物件顯示 14 個專案：

我想這樣顯示資料：

物件看起來像：

我需要在表/列標題中顯示“FieldName”，在表行中顯示“FieldValue”。注意第 3 項和第 5 項都是“電話號碼”欄位名稱。所以我需要 PhoneNumber 顯示一次（在列標題中）然后會有 2 行顯示 2 個電話號碼 FieldValues（如表格截圖中所示）。所以集合中可能有多組專案......例如N個聯系人等。我不確定如何設定轉發器（或使用多少）和/或如何設定轉發器OnItemDataBound。任何指向正確方向的想法或偽代碼都會非常有幫助。

Update: Calling API response returns List (i.e. Contacts)

Attributes objects (examples):

1st item: FieldName = "Name" FieldValue = "Mike Jones"

2nd item: FieldName = "Phone Number" FieldValue = "999-999-9999"

3rd item: FieldName = "Address" FieldValue = "123 Main St"

4th item: FieldName = "Name" FieldValue = "Mary Price"

5th item: FieldName = "Phone Number" FieldValue = "888-999-7777"

6th item: FieldName = "Address" FieldValue = "789 Broadway St"

Markup needs to show table:

-------------------------------------------------
|Name       |   Phone Number |  Address         |
-------------------------------------------------
|Mike Jones |   999-999-9999 |  123 Main St     |
-------------------------------------------------
|Mary Price |   888-999-7777 |  789 Broadway St |
-------------------------------------------------

uj5u.com熱心網友回復：

好的，所以問題很簡單：

我有一個名字串列，對于每個名字，我可能有一個電話號碼子表。他們可能沒有電話號碼，他們可能有 5 個電話號碼。

顯示此主記錄的好方法是什么，然后是每行重復的子記錄？

有很多方法可以做到這一點。我經常建議，對于行的主要顯示，我們使用串列視圖，然后為子行嵌套網格視圖。

但是，一如既往，哪條路將取決于多少資料，以及子資料顯示必須是多少行（復雜）？

但是，讓我們使用一個簡單的網格。由于這樣的設定變得更加復雜，我強烈建議使用串列視圖。串列視圖更好，因為它在布局方面更加靈活。雖然“設定”是更多的標記，但為每一行添加新列和復雜控制元件要好得多。從長遠來看，串列視圖實際上可能會降低整體標記。

但是，我們只有兩列額外的“子重復”資料。

所以我們實際上是這樣的：

 table people  - our list of contacts/people
 table Phones  - our child list of phone numbers for each "people".

所以，讓我們和桌子上的人一起制作一個網格。我會經常啟動并讓向導創建該網格。I THEN 吹出（洗掉）網頁中的資料源，然后開始使用洗掉鍵洗掉多余的垃圾。

所以，我們現在有了這個標記：

<div style="width:30%">
    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
        DataKeyNames="ID" CssClass="table">
        <Columns>
            <asp:BoundField DataField="Firstname" HeaderText="Firstname"  />
            <asp:BoundField DataField="LastName" HeaderText="LastName" />
            <asp:BoundField DataField="City" HeaderText="City"  />
        </Columns>
    </asp:GridView>
</div>

我們填充這個網格的代碼是這樣的：

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
            LoadGrid();
    }

    void LoadGrid()
    {
        DataTable rst = MyRst("SELECT * from People Order by FirstName");
        GridView1.DataSource = rst;
        GridView1.DataBind();
    }

    public DataTable MyRst(string strSQL)
    {
        DataTable rstData = new DataTable();
        using (SqlCommand cmdSQL = new SqlCommand(strSQL,
            new SqlConnection(Properties.Settings.Default.TEST4)))
        {
            cmdSQL.Connection.Open();
            rstData.Load(cmdSQL.ExecuteReader());
        }
        return rstData;
    }

我們的輸出是這樣的：

好的，所以我們當然有這個設定：

現在，我們可以做一個查詢連接，但話又說回來，這將重復每個子行的主行（然后我們將不得不“隱藏”它。

因此，讓我們轉到標記并添加兩行。（電話型別和電話號碼）。

所以我們現在有這個：

<div style="width:40%">
    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
        DataKeyNames="ID" CssClass="table">
        <Columns>
            <asp:BoundField DataField="Firstname" HeaderText="Firstname"  />
            <asp:BoundField DataField="LastName" HeaderText="LastName" />
            <asp:BoundField DataField="City" HeaderText="City"  />

            <asp:TemplateField HeaderText="Type">
                <ItemTemplate>
                    <asp:label ID="txtType" runat="server" Text = '<%# Eval("PhoneType") %>'></asp:label>
                </ItemTemplate>
            </asp:TemplateField>

            <asp:TemplateField HeaderText="Phone">
                <ItemTemplate>
                    <asp:label ID="txtPhone" runat="server" Text = '<%# Eval("Phone") %>' ></asp:label>
                </ItemTemplate>
            </asp:TemplateField>
        </Columns>  
    </asp:GridView>
</div>

（這就是我使用 gridview 的意思 - 放入漂亮的平面 jane asp.net 控制元件（在這種情況下是一個標簽），你必須用 itemtemplate 包圍它 - 如果你有“很多”，我發現有點痛苦列。所以如果你需要很多自定義列，那么串列視圖會更好。但到目前為止我們還不錯。

所以，我們的代碼現在變成了這樣：我們簡單地提取每個子行的資料，并將這個子表的結果推送到我們添加的兩個新列中。

這個：

   void LoadGrid()
    {
        DataTable rst = MyRst("SELECT * from People Order by FirstName");

        rst.Columns.Add("PhoneType", typeof(string));
        rst.Columns.Add("Phone", typeof(string));

        foreach (DataRow OneRow in rst.Rows)
        {
            // get child rows for this main row
            DataTable ChildRows = MyRst("SELECT * from Phones where People_ID = "   OneRow["ID"]);

            foreach (DataRow ChildRow in ChildRows.Rows)
            {
                if (OneRow["PhoneType"].ToString() != "")
                {
                    // start new line in this cell
                    OneRow["PhoneType"]  = "<br/>";
                    OneRow["Phone"]  = "<br/>";
                }
                OneRow["PhoneType"]  = ChildRow["PhoneType"].ToString();
                OneRow["Phone"]  = ChildRow["PhoneNumber"].ToString();
            }
        }

        GridView1.DataSource = rst;
        GridView1.DataBind();
    }

So this was a bit of extra code to loop! In fact, in MOST cases, if we are writing looping code, then we tend to be doing this the wrong way.

We now have this:

And it also depends on what we want to do here. Say we needed a click button for each of the child phone numbers (maybe a email also included). So if we had to click on the child email/phone to take action, then obvious the above approach is a bit quick and dirty, but would not give us the ability to click on a particular phone number row to select.

So, say if for some reason we wanted a click event, or button to select the given child row from this display?

Then I would then move over to nesting a child grid. We would not thus need a loop to fill the child data - but in fact would bind a new grid in a simular fashion to how we built the main grid.

如前所述，我可能會跳轉到主網格的串列視圖。

如果你愿意，我可以并且會發布一個在串列視圖中嵌套網格視圖的作業示例 - 說一個額外的按鈕來點擊子行作為我們可能想要采取的“動作”。

標籤：c# asp.net repeater nested-repeater

上一篇：當我單擊“確認”按鈕時，我想打開一個彈出視窗并確認“您確定嗎”、“是”、“否”。我該怎么做？

下一篇：EFCore5檢查過濾器中的所有id是否存在于相關物體中