Table grid control for ASP.NET

Question

What is the best way for me to build a control that will kinda work like an Access table in ASP.NET?

That is, I define, say, 3 columns. The user can add/edit/remove rows. It can be one row at a time, that's fine. There are other fields on the form too, not related to this table. When the user is done adding rows of information, then they hit 'submit', and at that point, is when I grab all the data out of the control and save to a database (or xml file or whatever).

I've tried to build something with ListView and/or GridView, and I just can't seem to get the behavior I want. Any ideas or examples?

Answer 1

You might want to look into jQuery's jqGrid.

Demo here. What I see in terms of grid manipulation are related to row editing, not too sure about columns though.

Related SO Posts here.

Answer 2

On link that could be useful:

Using the New ListView Control in ASP.NET 3.5
Eksample from own project:

               <asp:ListView ID="lvList" runat="server" OnLayoutCreated="lvList_LayoutCreated" OnItemDataBound="lvList_OnItemDataBound">
                    <LayoutTemplate>
                        <table id="tblTest" class="lvtest" cellpadding="0" cellspacing="0">
                            <tr>
                                <th class="listheader">
                                    <asp:Label ID="lbl1" runat="server" />
                                </th>
                                <th class="listheader">
                                    <asp:Label ID="lbl2" runat="server" />
                                </th>
                            </tr>
                            <tr runat="server" id="itemPlaceholder" />
                        </table>
                    </LayoutTemplate>
                    <EmptyDataTemplate>
                        <tr>
                            <td colspan="2">
                                <asp:Label ID="lblNotFound" runat="server" OnInit="lblOnInit" />
                            </td>
                        </tr>
                    </EmptyDataTemplate>
                    <ItemTemplate>
                        <tr class="<%# Container.DataItemIndex % 2 == 0 ? "odd" : "even" %>">
                            <td class="listcell">
                                <asp:Literal ID="lit1" runat="server" />
                            </td>
                            <td class="listcell">
                                <asp:Literal ID="lit1" runat="server" />
                            </td>
                        </tr>
                    </ItemTemplate>
                </asp:ListView>

Event handlers:

    protected void lvRist_LayoutCreated(object sender, EventArgs e)
    {
        SetHeaderValues();
    }


    //For the label when empty text
        protected void lblOnInit(object sender, EventArgs e)
    {
        SetEmptyText(sender);
    }



    protected void lvList_OnItemDataBound(object sender, ListViewItemEventArgs e)
    {
        if (e.Item.ItemType != ListViewItemType.DataItem) return;

        SetDataItem(e);
    }

Answer 3

I guess what I'm looking for is kinda a hack:

http://www.codeproject.com/KB/viewstate/retainingstate.aspx

But it seems to be the easiest way to what I want to accomplish.