如何在按类别分组的网格视图上进行行跨度？

Question

我在

GridView

上工作

CAT_DESC

我无法为包括多个活动的类别创建一个排跨度，每个类别的单元格都应包含几个活动单元格。

因此，我将按列表示的类别分组以包括多个。

用列表示的活性。

ACT_DESC

在此格式中，该类别由一个合并的单元格表示，而活动则显示在三个单独的单元格中。

在下面的代码显示所有行。

Example:

CAT_DESC    ACT_DESC
Car           bmw
Car           mercedes
Car           Fiat
After applying the merge cell row span, the expected result will be:

CAT_DESC    ACT_DESC
             bmw
Car          mercedes
             Fiat

实际上，我在这里建议什么？

以使用listView的速度。 GV控制非常适合大多数网格，但是当目标更加“困难”或更“花哨的裤子”时？

然后跳到ListView。当然，原因是ListView在布局方面具有更大的灵活性，并且“最重要”对行跨度具有更好的支持。

，例如，让我们假设一份酒店清单，但我们希望该市在纽约市的集团标题。

之后，代替GV，以下列表视图将显示此功能如何。

Answer 1

 if (response.ds.Tables["P_REGISTER_ACTS"] != null)
                            {
                                if (response.ds.Tables["P_REGISTER_ACTS"].Rows.Count > 0)
                                {

                                    gvResults.DataSource = response.ds.Tables["P_REGISTER_ACTS"];
                                    gvResults.DataBind();


                                }
                            }
<asp:GridView ID="gvResults" ClientIDMode="Static" runat="server"
    Caption='<div class="alert alert-info primary mb-0" style="color: white;">ترخيص</div>'
    CaptionAlign="Top"
    ShowFooter="False"
    RowStyle-CssClass="record"
    border="0"
    BorderColor="White"
    CellPadding="0"
    CellSpacing="2"
    CssClass="table table-bordered"
    PageSize="5"
    Width="100%"
    AutoGenerateColumns="false">
    
    <RowStyle HorizontalAlign="Center" CssClass="table-striped" />
    
    <HeaderStyle BackColor="#800080" ForeColor="White" CssClass="text-white header-center" HorizontalAlign="Center" />
    
    <Columns>
        <asp:BoundField DataField="CAT_DESC" HeaderText="الفئه" ItemStyle-Wrap="false" ItemStyle-HorizontalAlign="Center" />
        <asp:BoundField DataField="ACT_DESC" HeaderText="النشاط" ItemStyle-Wrap="false" ItemStyle-HorizontalAlign="Center" />
   
    </Columns>
</asp:GridView>

注意，我们如何有一个“全新”行的标题。因此，允许您“额外” TR（表行）。 因此，现在我们要做的就是显示（或隐藏）每个标题的额外TR。 因此，此代码：

<asp:ListView ID="ListView1" runat="server" DataKeyNames="ID" 
    OnItemDataBound="ListView1_ItemDataBound"  >
    <ItemTemplate>
        <tr id="MyHeading" runat="server" visible="false">
            <td colspan="4">
                <br />
                <asp:Label ID="lblCityHeading" runat="server" 
                    Text='<%# "Hotels for " + Eval("City") %>'
                    Font-Size="Large"/>
            </td>
        </tr>
        <div style="margin-left:25px!important;background-color:red">
        <tr>
            <td></td>
            <td><asp:Label ID="lblFirst" runat="server" Text='<%# Eval("FirstName") %>' /></td>
            <td><asp:Label ID="lblLast" runat="server" Text='<%# Eval("LastName") %>' /></td>
            <td><asp:Label ID="lblHotel" runat="server" Text='<%# Eval("HotelName") %>' /></td>
            <td>
                <asp:Label ID="txtDescription" runat="server" Text='<%# Eval("Description") %>'
                    width="240px" />
            </td>
        </tr>
        </div>
    </ItemTemplate>
    <LayoutTemplate>
        <table id="itemPlaceholderContainer" runat="server"
            class="table table-bordered table-hover" >
            <tbody>
                <tr runat="server">
                    <th runat="server" style="width:20px"></th>
                    <th runat="server" style="width:40px">First</th>
                    <th runat="server" style="width:40px">Last</th>
                    <th runat="server" style="width: 100px">Hotel Name</th>
                    <th runat="server" style="width: 140px">Description</th>
                </tr>
                <tr id="itemPlaceholder" runat="server" style="margin-left:25px">
                </tr>
            </tbody>
        </table>
    </LayoutTemplate>
</asp:ListView>

现在结果是：

，我建议使用listView代替GridView，因为您可以添加/具有额外的“ tr”（表行）元素，您可以轻松hide或显示这些元素，而这些TR元素支持Colspan。