Display Record

The ListView control contains many different events. In these examples, the EDIT button, REMOVE button, ADD button, and SAVE button click events are handled respectively.

Of course, there are many ways of implementations to get the job done, as far as I believed, using these ItemDataBound, ItemEditing, ItemDeleting, ItemCanceling, ItemUpdating, and ItemInserting are the easiest way.

Before implementing the code, design the UI first.

<table>
<thead>
    <tr>
        <th><asp:Literal ID="LitHost" runat="server" /></th>
        <th><asp:Literal ID="LitPointsTo" runat="server" /></th>
        <th><asp:Literal ID="LitTtl" runat="server" /></th>
        <th><asp:Literal ID="LitActions" runat="server" /></th>
    </tr>
</thead>

<tbody>
    <asp:ListView ID="LstItems" runat="server">
        <LayoutTemplate>
            <tr id="itemPlaceHolder" runat="server" />
        </LayoutTemplate>
        <ItemTemplate>
            <tr>
                <td><asp:Literal ID="LitHost" runat="server" /></td>
                <td><asp:Literal ID="LitPointsTo" runat="server" /></td>
                <td><asp:Literal ID="LitTtl" runat="server" /></td>
                <td>
                    <asp:LinkButton CommandName="Edit" ID="BtnEdit" runat="server" />
                    <asp:LinkButton CommandName="Delete" ID="BtnRemove" runat="server" />
                </td>
            </tr>
        </ItemTemplate>
        <EditItemTemplate>
            <tr>
                <td><asp:TextBox ID="TxtHost" runat="server" /></td>
                <td><asp:TextBox ID="TxtPointsTo" runat="server" /></td>
                <td><asp:DropDownList ID="DdlTtl" runat="server" /></td>
                <td>
                    <asp:LinkButton CommandName="Update" ID="BtnSave" runat="server" />
                    <asp:LinkButton CommandName="Cancel" ID="BtnCancel" runat="server" />
                </td>
            </tr>
        </EditItemTemplate>
        <InsertItemTemplate>
            <tr>
                <td><asp:TextBox ID="TxtNewHost" runat="server" /></td>
                <td><asp:TextBox ID="TxtNewPointsTo" runat="server" /></td>
                <td><asp:DropDownList ID="DdlNewTtl" runat="server" /></td>
                <td><asp:LinkButton ID="BtnAdd" CommandName="Insert" runat="server" /></td>
            </tr>
        </InsertItemTemplate>
    </asp:ListView>
</tbody>
</table>

In the code-behind, we need to hook up the ItemDataBound event, and bind the data source.

LstItems.ItemDataBound += new EventHandler<ListViewItemEventArgs>(LstItems_ItemDataBound);

LstItems.DataSource = DnsCollection;
LstItems.DataBind();

It is more flexible to handle the ItemDataBound event in the code-behind than binding the data source in the UI.

protected void LstItems_ItemDataBound(object sender, ListViewItemEventArgs e)
{
    var item = e.Item;
    if (item.ItemType == ListViewItemType.DataItem)
    {
        var currentDnsRecord = (DnsRecordItem)(item as ListViewDataItem).DataItem;

        // When Displaying the items
        if (item.DataItemIndex != LstItems.EditIndex)
        {
            var litHost = item.FindControl<Literal>("LitHost");
            var litPointsTo = item.FindControl<Literal>("LitPointsTo");
            var litTtl = item.FindControl<Literal>("LitTtl");

            litHost.Text = currentDnsRecord.HostName;
            litPointsTo.Text = currentDnsRecord.PointsTo;
            litTtl.Text = currentDnsRecord.TimeToLive;
        }
        else
        {   // When rendering Edit item.
            var txtHost = item.FindControl<TextBox>("TxtHost");
            var txtPointsTo = item.FindControl<TextBox>("TxtPointsTo");
            var ddlTtl = item.FindControl<DropDownList>("DdlTTL");

            txtHost.Text = OldDnsRecord.HostName;
            txtPointsTo.Text = OldDnsRecord.PointsTo;
            BindDdlTimeToLive(ddlTtl, OldDnsRecord.TimeToLive);
        }
    }
}

If you are not quite sure the FindControl, please check my previous post, FindControl() Extention methods.

On the other hand, when you want to do something before ItemDataBound event, you can create this ItemCreated event handler.

LstItems.ItemCreated += new EventHandler<ListViewItemEventArgs>(LstItems_ItemCreated);

ItemCreated is happened when the ListView is created, and when the data items are bound to the control.
ItemCreated is raised before the ItemDataBound event.

protected void LstItems_ItemCreated(object sender, ListViewItemEventArgs e)
{
    var item = e.Item;

    if (item.ItemType == ListViewItemType.DataItem)
    {
    }
    else if (item.ItemType == ListViewItemType.InsertItem)
    {
    }
}

Add Record

In order to have this ADD button work, what we need is to wire the events first in the page's code behind.

LstItems.ItemInserting += new EventHandler<ListViewInsertEventArgs>(LstItems_ItemInserting);

LstItems.ItemDeleting += new EventHandler<ListViewInsertEventArgs>(LstItems_ItemDeleting);

LstItems.InsertItemPosition = InsertItemPosition.LastItem;

And usually, we will have this insert template either in the first item of this ListView or the last item. In this example, it is in the last item.

Button "Add" click.

protected void LstItems_ItemInserting(object sender, ListViewInsertEventArgs e)
{
    if (!Page.IsValid)
    return;

    var txtNewHost = e.Item.FindControl<TextBox>("TxtNewHost");
    var txtNewPointsTo = e.Item.FindControl<TextBox>("TxtNewPointsTo");
    var ddlNewTtl = e.Item.FindControl<DropDownList>("DdlNewTTL");

    var host = txtNewHost.Text;
    var pointsTo = txtNewPointsTo.Text;
    var ttl = ddlNewTtl.SelectedValue;

    var result = AddNewRecord();
    if (result == Status.Ok)
    {
        // Rebind the ListView
    }
    else
    {
        // Do error handling
    }
}

Button "Remove" click.

protected void LstItems_ItemDeleting(object sender, ListViewInsertEventArgs e)
{
    var item = LstItems.Items[e.ItemIndex];

    var result = RemoveRecord();
    if (result == Status.Ok)
    {
        LstItems.EditIndex = -1;

        // Rebind the ListView
    }
    else
    {
        // Do error handling
    }
}

Edit Record

Same for this Edit Record, Save Record and Cancel button click events.

Wire the events in the code-behind first.

LstItems.ItemEditing += new EventHandler<ListViewItemEventArgs>(LstItems_ItemEditing);
LstItems.ItemUpdating += new EventHandler<ListViewItemEventArgs>(LstItems_ItemUpdating);
LstItems.ItemCanceling += new EventHandler<ListViewItemEventArgs>(LstItems_ItemCanceling);

Button "Edit" click.

protected void LstItems_ItemEditing(object sender, ListViewItemEventArgs e)
{
    var item = LstItems.Items[e.NewEditIndex];

    // Save the currently selected item to OldDnsRecord

    // ReBind the ListView
}

Button "Save" click.

protected void LstItems_ItemUpdating(object sender, ListViewItemEventArgs e)
{
    if (!Page.IsValid)
    return;

    var txtNewHost = e.Item.FindControl<TextBox>("TxtNewHost");
    var txtNewPointsTo = e.Item.FindControl<TextBox>("TxtNewPointsTo");
    var ddlNewTtl = e.Item.FindControl<DropDownList>("DdlNewTTL");

    var host = txtNewHost.Text;
    var pointsTo = txtNewPointsTo.Text;
    var ttl = ddlNewTtl.SelectedValue;

    var result = UpdateExistingRecord();
    if (result == Status.Ok)
    {
        LstItems.EditIndex = -1;

        // Rebind the ListView
    }
    else
    {
        // Do error handling
    }
}

Button "Cancel" click.

protected void LstItems_ItemCanceling(object sender, ListViewItemEventArgs e)
{
        LstItems.EditIndex = -1;

        // Rebind the ListView
}