topic

Review GridView

What is GridView

From the point of view of functionality is the same table, as well as DataGrid which each recording corresponds{meets} to recording in a source of the data. Each column can be associated with a field in a source of the data. Besides it, GridView (as well as DataGrid) has a cap (Header), the bottom page header (Footer) and the information on breakdown on pages (Pager).

GridView objavlen as:

[ControlValuePropertyAttribute ("SelectedValue")]

public class GridView: CompositeDataBoundControl, IPostBackContainer, IPostBackEventHandler, ICallbackContainer,

ICallbackEventHandler

CompositeDataBoundControl is a base class which provides linkage with the data (the given class in turn inherits DataBoundControl which is base for all data-bound kontrolov in ASP.NET 2.0.

IPostBackContainer and IPostBackEventHandler are necessary for processing all PostBack'ov kontrola, and realization of interfaces ICallbackContainer and ICallbackEventHandler allows to involve the new mechanism of client asynchronous calls.

GridView has set of properties and events which define{determine} his{its} behaviour. First of all, this connection with a source of the data and data acquisition, a conclusion of the data, updating of the data, and also sorting and breakdown on pages.

Objective model of sources of the data

This model represents the circuit when between a source of the data and a layer of a conclusion of the data (in our case it GridView) is one more layer which is the intermediary between a source and kontrolom visualization of the data and which gives the general{common} interface as for the first (a source of the data), and for the second (kontrolov to visualization, whether it be ours GridView or is allowable FormView). For an example we shall consider one of the basic kontrolov visualization - SqlDataSource. Apparently from the name, given kontrol it is intended for job with SQL. First of all, we should place this kontrol on the form (in any place of the form between tegami <form runat = "server"> and </form>):

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

This kontrol has 4 basic properties under which names it is possible to guess their applicability - SelectCommand, InsertCommand, UpdateCommand and DeleteCommand. On how to pass in these sql-commands parameters, I shall not stop is adequately separate clause{article}; that these properties describe sql-commands for each of 4 actions above the data is now important for us.

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

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

SelectCommand = " SELECT * FROM CartProducts "

InsertCommand = " INSERT INTO CartProducts (id_cat, [name], price) VALUES (@id_cat, @name, @price) "

UpdateCommand = " UPDATE CartProducts SET id_cat = id_cat, [name] = @name, price = price WHERE [id] = @id "

DeleteCommand = " DELETE FROM CartProducts WHERE [id] = @id ">

<asp:Parameter Name = "id" Type = "Int32"/>

</DeleteParameters>

</asp:SqlDataSource>

Sample, addition, updating and removal{distance} of the data.

First of all, it is necessary for us to connect ours GridView with a kontrolom-source. For this purpose at GridView there is property DataSourceID which value should correspond{meet} ID a kontrola-source. I want to pay attention that GridView has also property DataSource which serves for linkage of the data "in the old manner" - in a code with giving object such as IList. Use of both properties will simultaneously lead to to a mistake - it is necessary to use either DataSource, or DataSourceID.

So, we have connected DataSource with a kontrolom-source of the data. If property SelectCommand (for object ObjectDataSource it SelectMethod) is established - with GridView the data received as a result of performance of this command (or a method in a case with ObjectDataSource) will be connected.

<asp:GridView ID = "GridView1" runat = "server" DataSourceID = "SqlDataSource1" AutoGenerateColumns = "false">

<asp:BoundField HeaderText = "Name" DataField = "name"/>

<asp:BoundField HeaderText = "Price" DataField = "price"/>

</Columns>

</asp:GridView>

Further we shall engage in removal{distance} of lines (and recordings from a source of the data). As we see, DeleteCommand accepts parameter such as int which is called id and corresponds{meets} id to recording in the table. We know, that id is a unique field and consequently with pure{clean} conscience we do{make} this field key for ours GridView:

<asp:GridView ID = "GridView1" runat = "server" DataSourceID = "SqlDataSource1" DataKeyNames = "id" AutoGenerateColumns = "false">

<asp:BoundField HeaderText = "Name" DataField = "name"/>

<asp:BoundField HeaderText = "Price" DataField = "price"/>

</Columns>

</asp:GridView>

Further it is necessary for us to add the button for every line which will delete a line from GridView and from a source of the data. It is the easiest to make it, having added a new column such as CommandField:

<asp:GridView ID = "GridView1" runat = "server" DataSourceID = "SqlDataSource1" DataKeyNames = "id" AutoGenerateColumns = "false">

<asp:BoundField HeaderText = "Name" DataField = "name"/>

<asp:BoundField HeaderText = "Price" DataField = "price"/>

<asp:CommandField ShowDeleteButton = "true"/>

</Columns>

</asp:GridView>

We taste our page in operation:

Perfectly. Now more complex{difficult} action - editing. For editing it is necessary to translate a line necessary for us in a status of editing. For this purpose in ours (or in new, it who as wants) stolbce CommandField it is added ShowEditButton = "true"

<asp:GridView ID = "GridView1" runat = "server" DataSourceID = "SqlDataSource1" DataKeyNames = "id" AutoGenerateColumns = "false">

<asp:BoundField HeaderText = "Name" DataField = "name"/>

<asp:BoundField HeaderText = "Price" DataField = "price"/>

<asp:CommandField ShowDeleteButton = "true" ShowEditButton = "true"/>

</Columns>

</asp:GridView>

As we see, the line is translated in a mode of editing and for everyone BoundField instead of the usual text there is a text field. But if we shall see at ours UpdateCommand we shall see, that besides Name and Price we should pass still id_cat (ID categories to which the goods belong). Easy it can be made having added one more BoundField which will connect the given column with a field id_cat from the table, and in a status of editing will display TextBox. But to change a category, specifying her{it} id, corresponding id in the table - not the best variant, it would be much better to reflect in DropDownList. First of all we shall add a new column such as TemplateField, and for this column we shall define{determine} ItemTemplate and EditItemTemplate is as shown lower:

<asp:GridView ID = "GridView1" runat = "server" DataSourceID = "SqlDataSource1" DataKeyNames = "id" AutoGenerateColumns = "false">

<asp:TemplateField>

<asp:DropDownList runat = "server" ID = "ddlCategories"> </asp:DropDownList>

</EditItemTemplate>

<asp:Label runat = "server" ID = "lblCategory"> </asp:Label>

</ItemTemplate>

</asp:TemplateField>

<asp:BoundField HeaderText = "Name" DataField = "name"/>

<asp:BoundField HeaderText = "Price" DataField = "price"/>

<asp:CommandField ShowDeleteButton = "true" ShowEditButton = "true"/>

</Columns>

</asp:GridView>

Now at transition of a line in a status of editing instead of TextBox it will be shown DropDownList. Further it is necessary for us to connect this DropDownList with the list from table Categories. I want to inform, that in ASP.NET 2.0 set kontrolov has had an opportunity to work with objective model of sources of the data, including DropDownList. Therefore we add one more SqlDataSource on the form, we establish{install} to him SelectCommand-= “ SELECT * FROM Categories “, further we establish{install} property of ours DropDownList DataSourceID = "SqlDataSource2".

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

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

SelectCommand = " SELECT * FROM CartProducts ">

</asp:SqlDataSource>

<asp:GridView ID = "GridView1" runat = "server" DataSourceID = "SqlDataSource1" DataKeyNames = "id" AutoGenerateColumns = "false">

<asp:TemplateField HeaderText = "Category">

<asp:DropDownList runat = "server" ID = "ddlCategories" DataSourceID = "SqlDataSource2" DataTextField = "category" DataValueField = "id" SelectedValue = ' <% * Bind ("id_cat") %> '> </asp:DropDownList>

</EditItemTemplate>

<asp:Label runat = "server" ID = "lblCategory"> </asp:Label>

</ItemTemplate>

</asp:TemplateField>

<asp:BoundField HeaderText = "Name" DataField = "name"/>

<asp:BoundField HeaderText = "Price" DataField = "price"/>

<asp:CommandField ShowDeleteButton = "true" ShowEditButton = "true"/>

</Columns>

</asp:GridView>

Editing works, but in a status of display of a line it is necessary for us to deduce{remove} the name of a category. For this purpose we need id_cat to receive the name on value. Though also this problem{task} at desire it is possible to solve deklarativno, we shall write a pair of lines of code J

First of all we shall process event RowDataBound - analogue of event ItemDataBound in DataGrid.

protected void GridView1_RowDataBound (object sender, GridViewRowEventArgs e)

{

}

GridViewRow has properties RowState and RowType which have types of transfers DataControlRowState and DataControlRowType accordingly. As it is uneasy to guess - first of them stores{keeps} the current status of a line (for example, a line in a status of editing), and the second - type of a line (for example, that the given line is heading). To choose all "normal" lines and only in a mode of display, it is possible to use the following check:

protected void GridView1_RowDataBound (object sender, GridViewRowEventArgs e)

{

if (e. Row. RowType == DataControlRowType. DataRow **

(e. Row. RowState == DataControlRowState. Normal || e. Row. RowState == DataControlRowState. Alternate))

{

// We establish{install} necessary value for lblCategory ((Label) e. Row. FindControl ("lblCategory")) .Text = …

}

In GridView all odd lines are considered "normal", and all odd - alternative, therefore RowState is checked on 2 values. Using besides declarative programming "usual" programming in a code of page is possible to realize in GridView rather complex{difficult} logic.

Also I want to notice, that in case of use of "usual" programming for cases of updating or removal{distance} of the data it is necessary to use

Insert of new lines.

GridView has no standard means for an insert of new recordings. For this purpose it is convenient to use FormView and DetailView. If very much it would be desirable to realize an insert in GridView - it is possible to create the form in PagerTemplate.

Pay attention, that kontrol SqlDataSource has property InsertCommand.

GridView and Visual Studio.NET 2005.

All operations which we have done with page with GridView, it is possible to make and in a mode of designer Visual Studio.NET 2005. I shall say, that in Visual Studio.NET 2005 the new opportunity named smart tags which represents pop-up okoshka with adjustments of this or that component has appeared. The main features of this opportunity - convenience in use and ease of creation smart tags for own components. How to create smart tags, you can read in clause{article} in magazine MSDN Magazine for July, 2005. Clause{article} is called: ” Smart tags. Simplify UI Development With Custom Designer Actions In Visual Studio “, the author of clause{article}: Michael Weinhardt. So, pervedem our page in mode Design and and on GridView we shall press in a right top corner a triangular arrow{pointer}.

As we see, using Visual Studio.NET 2005 we can facilitate even more to ourselves a life - creation / editing of columns, adjustment of sorting, breakdown on pages, and also connection to those or others DataSource, in general, much that we did{made} above, we can make through this opportunity. Among other things, here enters takzhejumozhem to make through podobnynyjdelali above, we can make through similar configuration razdel.m or other

ovannym paramet an opportunity to configure itself DataSource. Section Columns also allows in one more additional okoshke to configure stolbcy as to us it is necessary - for each type stolbcov on the right there is a full list of his{its} properties, and the link ” Convert this field into a Template Column “ allows to translate this or that column in similar on functionality, but such as TemplateField. Further in TemplateField we can set new "values" for different modes of a column, for example establish DropDownList instead of TextBox for a mode of editing as it was required to us above.

Besides the new concept of communication{connection} with a source of the data, GridView in comparison with DataGrid has a little not so essential, but nevertheless pleasant innovations.

EmptyDataTemplate

In DataGrid esli the source has no any recording - that to deduce{remove} the message like « No recordings » it was necessary to do{make} such feint - to add any kontrol which deduces the text (for example, Label) and at bindinge to check quantity{amount} of recordings in a source and if this quantity{amount} was 0 - that to hide DataGrid, and in Label to deduce{remove} an inscription. And it was necessary to not forget also "to null" this line each time at bindinge since otherwise the inscription would remain even if the data have already appeared. In GridView new pattern EmptyDataTemplate is entered:

<asp:GridView ID = "GridView1" runat = "server">

No records

</EmptyDataTemplate>

</asp:GridView>

This inscription will be deduced{removed} only in case the source has no any recording, differently this block is ignored.

"Pair" events.

In ASP.NET 2.0 practically all kontroly (and GridView among them) have on two events for each "physical" event. One of them arises prior to the beginning of performance of the operation, the second - the ambassador. For example, RowDeleting and RowDeleted - in RowDeleting we can learn{find out} that will to leave.

Application of callbacks of page from javascript scripts.

Property EnablePagingAndSortingCallbacks (by default false) allows to apply technology of callbacks of page (it also an innovation in ASP.NET 2.0) to transition between pages and sortings of the data. I shall remind, that the given technology allows to not overload all page, and as though to overload only itself kontrol.

Adaptation GridView for mobile devices.

ASP.NET 2.0 allows the programmer to adapt GridView for generation HTML, more "friendly" for mobile devices. The brightest difference of mobile devices from the PC is a smaller screen. For a conclusion only one recording and the mechanism of navigation between them there is a group of elements SummaryTitle, DetailLink, DetailTitle and property SummaryViewColumn.

Breakdown on pages.

First of all I want to say, that SqlDataSource allows to optimize search to a DB and to choose only the data necessary for current page GridView (it is allowable if in GridView costs{stands} PageSize=20 SqlDataSource will choose only 20 recordings from those several thousand, that is in the table). And though it is more merit SqlDataSource, than GridView - the result of it affects on GridView J Also class PagerSettings (the class for job with paging) has the new predetermined buttons - first and last pages. Among other things, instead of the text it is possible to use a picture.

New types stolbcov.

For GridView some new types stolbcov are entered: CheckBoxField and ImageField under which names it is simple to guess that they from themselves represent J

Localization GridView.

The given paragraph is not an innovation in GridView and not actually localization of it kontrola, but I want to say about it a pair of words. By default all inscriptions in GridView are deduced in English. It is possible to make localization by standard way - creation of a file of resources with all corresponding inscriptions, and then replacement of all inscriptions by inscriptions of a file of resources, etc., and it is possible to make at one stroke - installation corresponding Language Pack and the instruction{indication} lokali in web.config. For example, for localization GridView on Russian it is possible to download .NET 2.0 Framework Russian Laguage Pack (http: // www.microsoft.co.ke/downloads/details.aspx? familyid=39C8B63B-F64B-4B68-A774-B64ED0C32AE7*displaylang=en) and installation

In web.config. As a by-effect all others are localized also kontroly, and also all system messages concerning this site (for example, error messages) are deduced in Russian.