locked
Web Form ListView with Gridlines RRS feed

  • Question

  • User-1627226156 posted

    Hi, the GridView has gridlines and I am trying to show something similiar to that in the ListView. Can anyone please help?

    Thursday, May 16, 2019 4:34 PM

Answers

  • User288213138 posted

    Hi  TimothyV,

     When the Gridview is displayed on the client side, it is rendered as a table,so you can add a Table in the ListView according to the style.

     I wrote a demo that you can use as a reference.

     The Code:

    <asp:ListView ID="ListView1" runat="server">
                     <LayoutTemplate>
                       <table border="1" style="border-collapse:collapse;">
                           <tr>
                               <td>ID</td>
                               <td>Title</td>
                           </tr>
                            <asp:PlaceHolder runat="server" ID="itemPlaceholder" />                      
                       </table>                  
                    </LayoutTemplate>
                    <ItemTemplate>                    
                            <tr >
                                <td><%#Eval("ID") %></td>
                                <td><%#Eval("Title") %></td>                 
                            </tr>                                          
                    </ItemTemplate>
                </asp:ListView>
    
    

    The result:

    Best regards,

    Sam

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, May 17, 2019 5:58 AM

All replies

  • User753101303 posted

    Hi,

    Depends which kind of HTML elements you are showing in your ListView.

    For example you could use https://www.w3schools.com/css/css_border.asp (a gridview renders table cells and what you see is the border of those cells) or a https://developer.mozilla.org/fr/docs/Web/CSS/box-shadow etc...

    Thursday, May 16, 2019 5:14 PM
  • User288213138 posted

    Hi  TimothyV,

     When the Gridview is displayed on the client side, it is rendered as a table,so you can add a Table in the ListView according to the style.

     I wrote a demo that you can use as a reference.

     The Code:

    <asp:ListView ID="ListView1" runat="server">
                     <LayoutTemplate>
                       <table border="1" style="border-collapse:collapse;">
                           <tr>
                               <td>ID</td>
                               <td>Title</td>
                           </tr>
                            <asp:PlaceHolder runat="server" ID="itemPlaceholder" />                      
                       </table>                  
                    </LayoutTemplate>
                    <ItemTemplate>                    
                            <tr >
                                <td><%#Eval("ID") %></td>
                                <td><%#Eval("Title") %></td>                 
                            </tr>                                          
                    </ItemTemplate>
                </asp:ListView>
    
    

    The result:

    Best regards,

    Sam

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, May 17, 2019 5:58 AM
  • User-1627226156 posted

    PatriceSc, thank you. I am trying to make it work with those methods. I was hoping for an example. Thanks for your response and have a great day!

    Friday, May 17, 2019 1:29 PM
  • User-1627226156 posted

    Sam, thank you so much! What a simple and clean solution. Embarrassingly easy. Have a great day! 

    Friday, May 17, 2019 1:33 PM