How to render a Gridview into a custom control?

Question

User1821599688 posted

 I want to wrap a Gridview into custom server control ,the makeup of the GridView is like this as follows, is it possible for me to render it into a custom server control and how:

 

<asp:GridView ID="gvItems" runat="server"
        BackColor="White" 
        BorderColor="#DEDFDE" BorderStyle="Solid" 
        BorderWidth="1px" CellPadding="4" 
        ForeColor="Black" GridLines="Vertical" 
        PageSize="1"  AutoGenerateColumns="False" 
        style="width:100%" DataSourceID="AccessDataSource1"
    >
    <HeaderStyle BackColor="#FF9900" Font-Bold="True" ForeColor="White" />
    <RowStyle BackColor="White" ForeColor="#333333" />        
    <AlternatingRowStyle BackColor="#F2F2F2" ForeColor="#333333" />
    <PagerSettings Position="Top" />
    <PagerStyle BackColor="#E4E4E4" ForeColor="#265CC0" Borderwidth="0px"/>    
     <Columns>
        <asp:TemplateField HeaderText="Item Details">
        <ItemTemplate>
         <table>
         <tr>
         <td>
            <img src="plus.gif" alt="click here to see details" 
                 onclick='ToggleDisplay(<%# Eval("id") %>);' 
                 style="cursor:pointer;height:15px;width:15px" />                 
         </td>         
         <td>
         <p><%# Eval("ItemId") %> </p>
         </td>
         <td>
         <a href="Item.aspx?id=<%# Eval("ItemId") %>"><%# Eval("ItemName") %></a>
         </td>
         <td>
         <%# Eval("price") %>
         </td>
         </tr>
         <tr>
         <td colspan="4">
                <div id='coldiv<%# Eval("id") %>' style="display:none;">
                <asp:Literal runat="server" ID="ltrl" 
                     Text='<%# Eval("ItemDesc") %>'></asp:Literal>
                </div> 
         </td> 
          </tr>
         </table>
         </ItemTemplate>
        </asp:TemplateField>     
     </Columns>     

    </asp:GridView>

Thanks.

Answer 1

User-1666980993 posted

This is definitely possible.  Since your control will contain other controls, you'll want to develop a particular type of control called a Composite Control.  This control acts as a container for other controls.

Here is a good in-depth article on developing Composite Controls:

http://msdn.microsoft.com/en-us/library/aa479016.aspx

I recommend you read this article, then read the MSDN documentation on the CompositeControl class.  This class acts as a base for composite controls that contain other controls.

Here's another article that gives a complete example of a composite control:

http://msdn.microsoft.com/en-us/library/3257x3ea.aspx

Answer 2

User1821599688 posted

 Hi, thank you for your answer.

 

Can you help me out to render the above specific Gridview control? That will be a big help to me.

 

Thanks in advance.

 

 

 

 

 

 

Answer 3

User-1666980993 posted

Everything you have in that markup is settable programmatically.  You can instantiate a GridView like any other object, set its properties, then render it (actually have it render itself by calling RenderControl() ) in your composite control.

GridView grdView = new GridView();
grdView.Property = Whatever;
....

 Refer to MSDN for details on how to get to all the properties you need:

http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.gridview.aspx

Answer 4

User1821599688 posted

 Hi, thanks you, The problem of me is how to render the following part:

<Columns>
        <asp:TemplateField HeaderText="Item Details">
        <ItemTemplate>
         <table>
         <tr>
         <td>
            <img src="plus.gif" alt="click here to see details" 
                 onclick='ToggleDisplay(<%# Eval("id") %>);' 
                 style="cursor:pointer;height:15px;width:15px" />                 
         </td>         
         <td>
         <p><%# Eval("ItemId") %> </p>
         </td>
         <td>
         <a href="Item.aspx?id=<%# Eval("ItemId") %>"><%# Eval("ItemName") %></a>
         </td>
         <td>
         <%# Eval("price") %>
         </td>
         </tr>
         <tr>
         <td colspan="4">
                <div id='coldiv<%# Eval("id") %>' style="display:none;">
                <asp:Literal runat="server" ID="ltrl" 
                     Text='<%# Eval("ItemDesc") %>'></asp:Literal>
                </div> 
         </td> 
          </tr>
         </table>
         </ItemTemplate>
        </asp:TemplateField>     
     </Columns>     

Can you help me with this part? 

Thanks. 

 

 

 

Answer 5

User481221548 posted

Hi jake

There is nothing more to say.
You have to do all the Declarations programmatically as dswersky said.

Answer 6

User1821599688 posted

 Hi, Peter,

 

To make things easier, can you help me out the following short one?:

 

<Columns>
        <asp:TemplateField HeaderText="Item Details">
        <ItemTemplate>
         <table>
          
         <p><%# Eval("ItemId") %> </p>
         </td>
         <td>
         <a href="Item.aspx?id=<%# Eval("ItemId") %>"><%# Eval("ItemName") %></a>
         </td>
        
          </tr>
         </table>
         </ItemTemplate>
        </asp:TemplateField>     
     </Columns>     

Thanks 

 

 

 

Answer 7

User481221548 posted

Hi

Add a new Class that implements ITemplate and add all needed Controls (Table, Hyperlink, etc...).

TemplateField field = new TemplateField();
field.ItemTemplate = new myItemTemplate(); // your ITemplate Class
<GridView>.Columns.Add(field);