In order to allow users to add rows to the ListView, the following needs to be taken care of:

A Hyperlink or a Button needs to be created for the user to click on. Once the user clicks the link, we should add a blank row to the ListView.

In the insert mode, we should have a “Save” option and a “Cancel” option.

If the user clicks “Save” a new row should be added to the database table

If the user clicks “Cancel” the insert operation should be cancelled.

Let us see how the above can be achieved:

Providing a Hyperlink/Button to add a new row to the Listview

Listing 3

<LayoutTemplate>
<asp:PlaceHolder ID="itemPlaceholder" runat="server"></asp:PlaceHolder>
<tr>
      <td colspan="5" align="center">
      <asp:LinkButton Text="Click here to add an Author" ID="lnkNew"
          runat="server" Font-Bold="true" OnClick="NewAuthor"></asp:LinkButton>
      </td>
</tr>
</LayoutTemplate>

In the ListView control definition, you should define a method which will be invoked when the event ItemInserting occurs. For example:

Listing 4

OnItemInserting="InsertList" 

And the InsertList method definition will look like as follows:

Listing 5

protected void InsertList(Object sender, ListViewInsertEventArgs e)
{
    ListView1.InsertItemPosition = InsertItemPosition.None; 
}

ListView has an InsertItemTemplate Template in which we can specify the controls that we need to show during the insert mode. For example:

Listing 6

<InsertItemTemplate>
<tr>
      <td><asp:TextBox id="txtLName" runat="server"></asp:TextBox></td>
      <td>
      <asp:LinkButton ID="lnkSave" CommandName="Save" runat="server" 
      Text="Save"></asp:LinkButton>
 
      <asp:LinkButton ID="lnkCancel" CommandName="Cancel" runat="server" 
      Text="Cancel"></asp:LinkButton>
      </td>
</tr>                
</InsertItemTemplate>

I the above code listing, we have one textbox and two links. The textbox is used to get the data from the user and will eventually be saved to the database. The action link, Save is used to save the data. We should write a custom function which will retrieve the textbox content and inserts the value to the database.  The command name for the Save link should be "Save". The action link, Cancel is used to cancel the insert operation. The command name for the Cancel link should be "Cancel". The code for the ItemCanceling event will look like as follows:

Listing 7

ListView1.InsertItemPosition = InsertItemPosition.None;
((LinkButton)ListView1.FindControl("lnkNew")).Visible = true;

In the above code, the first line removes the newly added row. The second line changes the visible property for "Click here to add an Author" hyperlink which is displayed in the ListView footer.

For saving data to the database, we should write custom code according to our business logic. The main purpose of the Save method should be to get the values for all controls. This can be achieved using the FindControl method. The following code snippet retrieves the value of a textbox control. Once the value is retrieved all we have to do is create a database connection and insert the data to the database.

Listing 8

TextBox txtLname = (TextBox)e.FindControl("txtLName");

Figure 2: ListView Insert mode