Search code examples
c#asp.netgridviewaspxgridview

asp.net gridview template field with second row spanning mutiple columns


Good Afternoon, I would like to know if this is possible. I have a gridview with several (4 template fields). The 4 fields include

  1. First Name
  2. Last Name
  3. Phone
  4. Email

What I would like to do is get a fifth data column(address) completely on a different row so that the data looks like this.

  • Row #1 | First Name | Last Name | Phone | Email| Record #1
  • Row #2 | Address | Record #1
  • Row #3 | First Name | Last Name | Phone | Email| Record #2
  • Row #4 | Address | Record #2

Can anybody help me with this, please?


Solution

  • For some reason this question is upvoted. I will wrote you an answer:

    <table>
        <asp:Repeater runat="server" ID="repeater1" >
           <ItemTemplate>
              <tr>
                   <td> <%#Eval("FirstName")%></td>
                   <td> <%#Eval("LastName")%></td>
                        ....//other <td></td>
              </tr>
              <tr>
                   <td><%#Eval("Address")%></td>
              </tr>
           </ItemTemplate>
        </asp:Repeater>
    </table>
    

    I will leave for you the css part, also if you want to have column names look into <th> tags, but I don't know how you will achieve that properly when you have on row 1 columns different form row 2. If you want to have delete/edit functionality you should add new td with linkButton/ImageButton/Button with functionality which will delete/edit the current row. For this you will need <%#Eval("ID")%> in CommandArguments of the button. But again in this case this will be interesting because you have one record on 2 rows. The design decision is done by you this is the solution.

    You should probably look how to have multiple columns on row 1 and only one on row 2, this was attribute of td colspan

    In code behind:

            repeater1.DataSource = dst; // this should be data set containing all the needed values
            repeater1.DataBind();