how to add a rowspan to the first column in a gridview?

Question

I have a gridview and in the first column I added a table to create a second row:

I would like the shipper address to span across all the columns in the gridview.

Code:

   <asp:GridView  CssClass="printTableResults" runat="server" ID="gvHawb" 
                                    ShowHeaderWhenEmpty="false"
                                    DataKeyField="ID" 
                                    OnRowDataBound="gvHawb_RowDataBound"
                                    AutoGenerateColumns="false"
                                    allowpaging="false">
                                    <HeaderStyle CssClass="printTableHeader" /> 
                                    <RowStyle CssClass="borderB" />
                                    <Columns> 
                                        <asp:TemplateField  HeaderText="HAWB" HeaderStyle-Font-Bold="true" ItemStyle-HorizontalAlign="Center">
                                            <ItemTemplate>
                                                <table>
                                                    <tr>
                                                        <td><asp:Label ID="lblAwbNumber" runat="server" Text='<%# Eval("AWBNumber") %>'></asp:Label></td>
                                                    </tr>
                                                    <tr>
                                                        <td><label>Shipper</label></td>
                                                        <td><asp:Label ID="lblFullShipperAddress" runat="server" Text='<%# Eval("FullShipperAddress") %>'></asp:Label></td>
                                                    </tr>   
                                                </table>
                                            </ItemTemplate>
                                        </asp:TemplateField> 
                                        <asp:TemplateField HeaderText="Pieces" HeaderStyle-Font-Bold="true" ItemStyle-HorizontalAlign="Center">
                                            <ItemTemplate>
                                                <asp:Label ID="lblPieces" runat="server" Text='<%# Eval("TotalNoOfPieces") %>'></asp:Label>
                                            </ItemTemplate>
                                        </asp:TemplateField>
                                 </Columns>                
                            </asp:GridView>

Is there a way to make shipper span the rows of the gridview? There is a total of 8 columns in this gridview.

Answer 1

You could try moving the table with the shipper address to the ItemTemplate of the last column in the outer table. Then put the table on its own tr. Something like this:

<ItemTemplate>

    <asp:Label ID="lblPieces" runat="server" Text='<%# Eval("TotalNoOfPieces") %>'></asp:Label>

    </tr>                 <!-- end the outer table row -->
    <tr colspan="7">      <!-- start new row in the outer table -->
        <table>
            <tr>
                <td><asp:Label ID="lblAwbNumber" runat="server" Text='<%# Eval("AWBNumber") %>'></asp:Label></td>
            </tr>
            <tr>
                <td><label>Shipper</label></td>
                <td><asp:Label ID="lblFullShipperAddress" runat="server" Text='<%# Eval("FullShipperAddress")%>'></asp:Label></td>
            </tr>
        </table>

</ItemTemplate>

Note that you should not finish up with an ending </tr> because the outer table rendering will add that.

This answer was put together without any real testing so I'm not guaranteeing that it will work "out of the box".

Answer 2

If you want the first cell to span all 8 columns of the row, you can add this handler to the PreRender event of the GridView:

void gvHawb_PreRender(object sender, EventArgs e)
{
    foreach (GridViewRow row in gvHawb.Rows)
    {
        if (/* some condition */)
        {
            // Remove the other cells of the row
            while (row.Cells.Count > 1)
            {
                row.Cells.RemoveAt(1);
            }

            // Set the ColumnSpan attribute
            row.Cells[0].ColumnSpan = 8;
        }
    }
}

I assume that it would be done on rows that meet a specific condition.

You may also consider using a ListView, which is easier to customize than the GridView.