Click here to Skip to main content
15,893,588 members
Please Sign up or sign in to vote.
1.00/5 (1 vote)
See more:
Hi Experts,
In a Gridview let's say I have columns [ID, Name, Grade, Age, Notes]
Notes field is a big one, a lot of information.
I want to display Notes field as a row. Is it possible to do it?
so it will be something like this [ID, Name, Grade, Age]
and underneath [Notes]

Please advise

Thank you
Samira
Posted
Updated 11-Jun-15 6:50am
v2
Comments
Sergey Alexandrovich Kryukov 11-Jun-15 13:01pm    
Yes, it is possible. What's the problem?
—SA
Samira Radwan 11-Jun-15 13:47pm    
just don't know how to do it, thanks

1 solution

That sort of layout is tricky to accomplish with a GridView, but almost trivial to do with a ListView[^]. :)

ListView Web Server Control Overview[^]

HTML
<asp:ListView id="GradeList" runat="server">
<LayoutTemplate>
    <table>
    <thead>
        <tr>
            <th scope="col">ID</th>
            <th scope="col">Name</th>
            <th scope="col">Grade</th>
            <th scope="col">Age</th>
        </tr>
    </thead>
    <tbody>
        <tr id="itemPlaceholder" runat="server" />
    </tbody>
    </table>
</LayoutTemplate>
<ItemTemplate>
    <tr>
        <th scope="row">
            <asp:Literal runat="server" Mode="Encode"
                Text='<%# Eval("ID") %>'
            />
        </th>
        <td>
            <asp:Literal runat="server" Mode="Encode"
                Text='<%# Eval("Name") %>'
            />
        </td>
        <td>
            <asp:Literal runat="server" Mode="Encode"
                Text='<%# Eval("Grade") %>'
            />
        </td>
        <td>
            <asp:Literal runat="server" Mode="Encode"
                Text='<%# Eval("Age") %>'
            />
        </td>
    </tr>
    <tr>
        <td colspan="4">
            <asp:Literal runat="server" Mode="Encode"
                Text='<%# Eval("Notes") %>'
            />
        </td>
    </tr>
</ItemTemplate>
</asp:ListView>
 
Share this answer
 
Comments
Samira Radwan 11-Jun-15 15:35pm    
thank you, that works for me had to add ItemPlaceholderID to make it work, but the headers not showing! any suggestions?
Richard Deeming 11-Jun-15 15:39pm    
That's strange - "itemPlaceholder" should be the default value for the ItemPlaceholderID property.

Check the rendered HTML to make sure the <table> and its <thead> are being rendered. If they are, then there must be some CSS that's hiding them.
Samira Radwan 11-Jun-15 15:54pm    
thank you, but no!! still not showing. The only change i have done is adding runat="server" and the table Id is the same as ItemPlaceholderID otherwise it won't work
Richard Deeming 11-Jun-15 15:58pm    
No, don't set the id on the <table>!

The element in the <LayoutTemplate> with the ID that matches the ItemPlaceholderID is what gets replaced with the content of the <ItemTemplate> for each row.

If you set the <table> to be the item placeholder, then you'll get a bunch of <tr> tags with no outer <table>, and no header.

The <tr> inside the <tbody> needs to be the item placeholder.
Samira Radwan 11-Jun-15 16:10pm    
That works! thanks a lot, Have a good evening :)

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900