topic

Review DetailsView

Element of management DetailsView - one of novelties ASP.NET 2.0. He allows to look through on one recording from a source of the data whereas GridView shows them all at once. It can be compared to different types of forms in Access: the tabulared form corresponds{meets} GridView, and Columnar - DetailsView. The same way, as well as GridView, DetailsView allows breakdown on pages, editing, an insert and removal{distance} with automatic linkage with a source of the data. He also is successor CompositeDataBoundControl.

Visual Studio 2005 gives, as it is usual, Smart Tag with which help it is possible to set a source of the data, avtoformatirovat` an element of management, to edit fields and patterns of fields.

Example DetailsView where the data undertake from database Northwind, table Employees.

<asp:DetailsView ID = "DetailsView1" runat = "server" AutoGenerateRows = "False" DataSourceID = "SqlDataSource1"

Height = "50px" Width = "561px" BackColor = "White" BorderColor = " * DEDFDE " BorderStyle = "None" BorderWidth = "1px" CellPadding = "4" GridLines = "Vertical" ForeColor = "Black" AllowPaging = "True">

<asp:BoundField DataField = "LastName" HeaderText = "LastName" SortExpression = "LastName"/>

<asp:BoundField DataField = "FirstName" HeaderText = "FirstName" SortExpression = "FirstName"/>

<asp:BoundField DataField = "Title" HeaderText = "Title" SortExpression = "Title"/>

<asp:BoundField DataField = "TitleOfCourtesy" HeaderText = "TitleOfCourtesy" SortExpression = "TitleOfCourtesy"/>

<asp:BoundField DataField = "BirthDate" HeaderText = "BirthDate" SortExpression = "BirthDate"/>

<asp:BoundField DataField = "HireDate" HeaderText = "HireDate" SortExpression = "HireDate"/>

<asp:BoundField DataField = "Address" HeaderText = "Address" SortExpression = "Address"/>

<asp:BoundField DataField = "City" HeaderText = "City" SortExpression = "City"/>

<asp:BoundField DataField = "Notes" HeaderText = "Notes" SortExpression = "Notes"/>

<asp:BoundField DataField = "HomePhone" HeaderText = "HomePhone" SortExpression = "HomePhone"/>

<asp:BoundField DataField = "Country" HeaderText = "Country" SortExpression = "Country"/>

<asp:BoundField DataField = "PostalCode" HeaderText = "PostalCode" SortExpression = "PostalCode"/>

<asp:BoundField DataField = "Region" HeaderText = "Region" SortExpression = "Region"/>

</Fields>

</asp:DetailsView>

<asp:SqlDataSource ID = "SqlDataSource1" runat = "server" ConnectionString = " <% $ ConnectionStrings:NorthwindConnectionString3 %> "

SelectCommand = " SELECT [LastName], [FirstName], [Title], [TitleOfCourtesy], [BirthDate], [HireDate], [Address], [City], [Extension], [ReportsTo], [Photo], [Notes], [HomePhone], [Country], [PostalCode], [Region] FROM [Employees] " ProviderName = " <% $ ConnectionStrings:NorthwindConnectionString3. ProviderName %> "> </asp:SqlDataSource>

And so it looks on the form:

Autoformatting Mocha was applied.

Properties of a pager same as at GridView. Unique difference - absence of property PageSize - as DetailsView always displays one recording. For example, for navigation on pages to use a picture. Thus PagerSettings:Mode should be set as NumericFirstLast.

<PagerSettings FirstPageImageUrl = "~/RW_btn.gif" LastPageImageUrl = "~/FF_btn.gif" Mode = "NumericFirstLast"

NextPageImageUrl = "~/fwd_btn.gif" PreviousPageImageUrl = "~/back_btn.gif"/>

So it is much more beautiful. A picture are taken from delivery CorelDraw 11. It is strange, that such opportunity have not entered in a calendar, I hope in the following version will appear.

Elements of a collection of fields BoundField are described the same as and in GridView, but the text of heading appears at the left, instead of from above.

Sharing with GridView

If in recording it is a lot of fields on one page in GridView it is possible to display some from them, and in DetailsView to deduce{remove} the full information.

That it to realize, two are necessary SqlDataSource which are connected to one base through the same ConnectionString. The first - usual, reads all recordings:

<asp:SqlDataSource ID = "SqlDataSource1" runat = "server"

ConnectionString = " <% $ ConnectionStrings:NorthwindConnectionString %> "

SelectCommand = " SELECT * FROM [Employees] "

ProviderName = " <% $ ConnectionStrings:NorthwindConnectionString. ProviderName %> ">

The line of connection is defined{determined} in Web.config:

<add name = "NorthwindConnectionString" connectionString = " Data Source =. SQLExpress; Initial Catalog=Northwind; Integrated Security=True; Pooling=False "

providerName = " System. Data. SqlClient "/>

SqlDataSource1 It is connected with GridView which supports an opportunity of a choice of recording.

<asp:GridView ID = "GridView1" runat = "server" AllowPaging = "True" AutoGenerateColumns = "False" CellPadding = "4" DataSourceID = "SqlDataSource1" ForeColor = " * 333333 " GridLines = "None" AllowSorting = "True" PageSize = "3" DataKeyNames = "EmployeeID" SelectedIndex = "0">

<asp:CommandField ShowSelectButton = "True"/>

<asp:BoundField DataField = "LastName" HeaderText = "Surname" SortExpression = "LastName"/>

<asp:BoundField DataField = "FirstName" HeaderText = "Name" SortExpression = "FirstName"/>

</Columns>

</asp:GridView>

If not to specify SelectedIndex = "0" in the beginning it will not be chosen any recording and DetailsView on page will not appear.

The second SqlDataSource filters the information on EmployeeID.

<asp:SqlDataSource ID = "SqlDataSource2" runat = "server"

SelectCommand = " SELECT * FROM [Employees] WHERE ([EmployeeID] = @EmployeeID) "

ConnectionString = " <% $ ConnectionStrings:NorthwindConnectionString %> ">

<asp:ControlParameter ControlID = "GridView1" Name = "EmployeeID"

PropertyName = "SelectedValue" Type = "String"/>

</SelectParameters>

</asp:SqlDataSource>

The most important here - SelectParameters. Thus in SelectCommand command that is substituted EmployeeID that recording which has been chosen in GridView1.

<asp:DetailsView ID = "DetailsView1" runat = "server"

DataSourceID = "SqlDataSource2"

Height = "50px" Width = "561px"

CellPadding = "4" GridLines = "None" ForeColor = " * 333333 "

HeaderText = "Private affair"

AutoGenerateRows = "False" DataKeyNames = "EmployeeID">

<asp:BoundField DataField = "LastName" HeaderText = "Surname" SortExpression = "LastName"/>

<asp:BoundField DataField = "FirstName" HeaderText = "Name" SortExpression = "FirstName"/>

<asp:BoundField DataField = "Title" HeaderText = "Post" SortExpression = "Title"/>

<asp:BoundField DataField = "BirthDate" HeaderText = " Date of a birth " SortExpression = "BirthDate"/>

<asp:BoundField DataField = "HireDate" HeaderText = " Date of reception " SortExpression = "HireDate"/>

<asp:BoundField DataField = "HomePhone" HeaderText = "Phone" SortExpression = "HomePhone"/>

</Fields>

</asp:DetailsView>

Insert of recordings with help DetailsView

That we DetailsView has learned to insert recordings, it is necessary to establish property

AutoGenerateInsertButton = "True". In an element of management there is button " New ". It is necessary to press her{it}, and the data are replaced on TextBox-?.

But while recordings will not be inserted. In SqlDataSource it is necessary to define{determine}

1. Property InsertCommand

2. On one InsertParameter For each field.

<asp:SqlDataSource ID = "SqlDataSource2" runat = "server"

SelectCommand = " SELECT * FROM [Employees] WHERE ([EmployeeID] = @EmployeeID) "

InsertCommand = " INSERT INTO [Employees] ([LastName],

[FirstName], [Title], [BirthDate], [HireDate], [HomePhone])

VALUES (@LastName,

@FirstName, @Title, @BirthDate, @HireDate, @HomePhone) "

ConnectionString = " <% $ ConnectionStrings:NorthwindConnectionString %> ">

<asp:ControlParameter ControlID = "GridView1" Name = "EmployeeID"

PropertyName = "SelectedValue"

</SelectParameters>

<asp:Parameter Type = "String" Name = "CustomerID"> </asp:Parameter>

<asp:Parameter Type = "String" Name = "LastName"> </asp:Parameter>

<asp:Parameter Type = "String" Name = "FirstName"> </asp:Parameter>

<asp:Parameter Type = "String" Name = "Title"> </asp:Parameter>

<asp:Parameter Type = "String" Name = "BirthDate"> </asp:Parameter>

<asp:Parameter Type = "String" Name = "HireDate"> </asp:Parameter>

<asp:Parameter Type = "String" Name = "HomePhone"> </asp:Parameter>

</InsertParameters>

</asp:SqlDataSource>

Anything complex{difficult}, whether not so?:)

It is possible to update also higher GridView that in him inserted recording was immediately displayed. We shall write obrabotchik events ItemInserted.

protected void DetailsView1_ItemInserted (object sender, DetailsViewInsertedEventArgs e)

{

GridView1. DataBind ();

}

Job with patterns of fields.

Input of dates would be easier for organizing with the help of a calendar. For this purpose it is possible to define{determine} shablonizirovannoe a field.

<asp:TemplateField HeaderText = " Date of reception " SortExpression = "HireDate">

<asp:TextBox ID = "TextBox1" runat = "server" Text = ' <% * Bind ("HireDate") %> '> </asp:TextBox>

</EditItemTemplate>

<asp:Calendar ID = "CalendarHireDate" runat = "server"

BackColor = " * EFF3FB " ForeColor = " * 003399 "

SelectedDate = ' <% * Bind ("HireDate") %> '> </asp:Calendar>

</InsertItemTemplate>

<asp:Label ID = "Label1" runat = "server" Text = ' <% * Bind ("HireDate") %> '> </asp:Label>

</ItemTemplate>

</asp:TemplateField>

And, certainly, it is necessary to change type of parameters.

<asp:Parameter Type = "DateTime" Name = "HireDate"> </asp:Parameter>

Editing and removals{distances} are done{made} precisely how in GridView.

Method Bind, as against method Eval, works in both parties{sides}, that is not only reads the data from a source of the data, but also allows to update it{him}.

The opportunity of an insert of recordings DetailsView allows to expand opportunities of job with sources of the data in ASP .NET 2.0.

Events DetailsView

At DetailsView there are pairs events which occur at linkage to the data, at transition from browse mode in insert mode, at browsing page.

ItemCreated

ItemDeleting - ItemDeleted

ItemInserted - ItemInserting

ItemUpdated - ItemUpdating

ModeChanged - ModeChanging

In table Employees some fields should be filled, at them costs{stands} AllowNulls=false. Therefore at job of our form there will be an exception if to try to insert recording, not having entered a name and a surname. To avoid it, during processing event ItemInserting it is necessary to make check. Also we shall process event ModeChanged to remind the client of his{its} duties.))

protected void DetailsView1_ModeChanged (object sender, EventArgs e)

{

switch (DetailsView1. CurrentMode)

{

case DetailsViewMode. Insert:

DetailsView1. HeaderText = " Fill, please, in the form. The name and a surname are obligatory. ";

DetailsView1. HeaderStyle. ForeColor = System. Drawing. Color. Purple;

DetailsView1. HeaderStyle. BackColor = System. Drawing. Color. AliceBlue;

break;

case DetailsViewMode. ReadOnly:

DetailsView1. HeaderText = "Private affair";

DetailsView1. HeaderStyle. ForeColor = System. Drawing. Color. White;

DetailsView1. HeaderStyle. BackColor = System. Drawing. Color. FromArgb (0x507CD1);

break;

}

As DetailsView1 all the same the table, we search for fields of input in 0 and 1 line in 1 stolbce. If there it is empty, we shall cancel an insert.

protected void DetailsView1_ItemInserting (object sender, DetailsViewInsertEventArgs e)

{

TextBox textbox1 = (TextBox) DetailsView1. Rows [0] .Controls [1] .Controls [0];

textbox1. Text. Trim ();

TextBox textbox2 = (TextBox) DetailsView1. Rows [1] .Controls [1] .Controls [0];

textbox2. Text. Trim ();

if (textbox1. Text == " " || textbox2. Text == " ")

e. Cancel = true;

}

Program management DetailsView

Let's assume, we have found tabulared performance of the information on the worker too boring. We want to write the list of characteristics of workers as the coherent text, and in DetailsView to leave only coordinates (the address, phone).

The characteristic is written with the help of element Repeater. Inside him{it} is DetailsView. The source of the data ripitera-table Employees, as well as is higher. And what to establish a source at DetailsView? If same for all recordings will be the same information - from the first recording the table is deduced. So the source filtered according to EmployeeID is necessary for each recording.

<asp:SqlDataSource ID = "SqlDataSource1" runat = "server" ConnectionString = " <% $ ConnectionStrings:NorthwindConnectionString1 %> "

SelectCommand = " SELECT * FROM [Employees] ">

</asp:SqlDataSource>

<asp:Repeater ID = "Repeater1" runat = "server" DataSourceID = "SqlDataSource1" OnItemCreated = "Repeater1_ItemCreated">

<% * DataBinder. Eval (Container. DataItem, "TitleOfCourtesy") %>

<% * DataBinder. Eval (Container. DataItem, "FirstName") %>

<% * DataBinder. Eval (Container. DataItem, "LastName") %> was born in

<% * ((DateTime) DataBinder. Eval (Container. DataItem, "BirthDate")) .ToLongDateString () %>.

He/She lives in <% * DataBinder. Eval (Container. DataItem, "City") %>

of the great country <% * DataBinder. Eval (Container. DataItem, "Country") %>.

We appreciate her work as <% * DataBinder. Eval (Container. DataItem, "Title") %>.

<% * DataBinder. Eval (Container. DataItem, "Notes") %>

<asp:DetailsView ID = "DetailsView1" runat = "server" AutoGenerateRows = "False" DataKeyNames = "EmployeeID"

Height = "50px" Width = " 82 % ">

<asp:BoundField DataField = "Address" HeaderText = "Address" SortExpression = "Address"/>

<asp:BoundField DataField = "Region" HeaderText = "Region" SortExpression = "Region"/>

<asp:BoundField DataField = "PostalCode" HeaderText = "PostalCode" SortExpression = "PostalCode"/>

<asp:BoundField DataField = "HomePhone" HeaderText = "HomePhone" SortExpression = "HomePhone"/>

<asp:BoundField DataField = "Extension" HeaderText = "Extension" SortExpression = "Extension"/>

<asp:ImageField HeaderText = "Photo" DataImageUrlField = "PhotoPath">

</asp:ImageField>

</Fields>

</asp:DetailsView>

</ItemTemplate>

</asp:Repeater>

During processing event ItemCreated when the data are not connected yet, it is possible to connect dynamically DetailsView with the data.

protected void Repeater1_ItemCreated (object sender, RepeaterItemEventArgs e)

{

if (e. Item. ItemType == ListItemType. Item || e. Item. ItemType == ListItemType. AlternatingItem)

{

SqlDataSource sds = new SqlDataSource ();

sds. ConnectionString = SqlDataSource1. ConnectionString;

sds. ID = "SqlDataSource2";

string Filter = String. Format (" where EmployeeID = ' {0} ' ", ((DataRowView) e. Item. DataItem) ["EmployeeID"]);

sds. SelectCommand = " SELECT * FROM [Employees] " + Filter;

e. Item. Controls. Add (sds);

System. Web. UI.WebControls. DetailsView ds = (System. Web. UI.WebControls. DetailsView) e. Item. FindControl ("DetailsView1");

if (ds! = null)

ds. DataSourceID = sds. ID;

}

The same way it is possible to connect DetailsView with BulletedList, with DropDownList and others.

Generalizing said, it is possible to say, that DetailsView is not only vertical table with an opportunity to consider details of interesting recording, but also an opportunity to insert recordings in the table, not creating additional elements of management and to not write thus a plenty of a code.