Programming Microsoft ASP.NET 4 - Dino Esposito [261]
DataSourceID="ObjectDataSource1" DataKeyNames="id"> ...
In this case, the DataKeyNames tells the underlying data source control that the ID field on the bound record has to be used as the key. Figure 11-10 shows a sample page in action that edits the contents of the currently displayed record.
Figure 11-10. In-place editing in action with the ListView control.
Deleting an Existing Record
As you can see, Figure 11-10 also contains a Delete button side by side with the aforementioned Edit button. Here’s the full markup for ListView’s item template:
<%# Eval("CompanyName") %> <%# Eval("Street") %>, <%# Eval("City") %>, <%# Eval("Country") %>
The Delete operation is even more crucial than an update. For this reason, you might want to be sure that deleting the record is exactly what the user wants. For example, you can pop up a client-side message box in which you ask the user to confirm the operation. It is a little piece of JavaScript code that you attach to the OnClientClick property of a Button control or to the onclick attribute of the corresponding HTML tag. It can save you a lot of trouble.
Showing a Message Box upon Completion
Wouldn’t it be nice if your application displays a message box upon the completion of an update operation? It doesn’t change the effect of the operation, but it would make users feel more comfortable. In a Web scenario, you can use only JavaScript for this purpose. The trick is that you register a piece of startup script code with the postback event where you execute the update operation. In this way, the script will be executed as soon as the page is served back to the browser. From the user’s perspective, this means right after the completion of the operation. Here’s what you need:
protected void ListView1_ItemUpdated(object sender, ListViewUpdatedEventArgs e)
{
// Display a client message box at the end of the operation
Page.ClientScript.RegisterStartupScript(
this.GetType(),
"update_Script",
"alert('You successfully updated the system.');",
true);
}
Inserting New Data Items
The ListView control allows you to define a made-to-measure interface for adding new records to the underlying data source. You do this through the InsertItemTemplate property. More often than not, the insert template is nearly identical to the edit item template, except for the fields that form the primary key of the data source. These fields are normally rendered as read-only text in the edit template. Clearly they have to be editable in an insert item scenario.
Setting Up the Insert Item Template
So let’s assume you have the following insert item template. As you can easily verify, it is the same edit item template we used in the previous example, except that a TextBox control is used for entering the ID of the new customer.
Text='<%# Bind("ID") %>' />ID Name Country Street City