Server controls, Types of server controls - Design...

Server Controls

Server Controls (SIS) are the core part of the ASP.Net Web Forms architecture. Essentially, ECS are the .Net Framework library classes that perform the solution of some small standard tasks and represent the visual interface of the web form. Some of these classes are fairly simple and directly correspond to some HTML-tag (HTML control). Other SEAs are complex and form a set of HTML tags and a script in JavaScript.

Server controls must be located inside the HTML form element, which has the attribute runat-'server (that is, this element is a server-side HTML element).

Types of server controls

All server controls are divided into HTML controls and web controls (or web-based controls).

Web Server Controls

The most commonly used server-based ECs are server-based web-based management systems. They have great opportunities for creating a user interface and organizing user interaction with a web form. In ASP.Net there are more than 50 such controls. Server controls in the web form template (* .aspx file) are specified using special server-side tags, which in the simple case are:

& lt; asp: [username] id = [name] [atr1] = [val1] [atr2] = [val2] ... runat = "server" & gt;

& lt; asp: [username]

All server ECs have the prefix "asp:", which indicates that this tag is not an HTML tag, but is processed on the side of the web server. The attributes of the EC correspond to the properties and events of the objects that are created for them. The attribute record must meet the following basic requirements:

• for each server-based EC, the attributes id = name '' and runat- server & quot ;;

• attributes are separated by spaces, and the order of their occurrence is arbitrary;

• the attributes corresponding to events are named on [event_name] , and their value is the name of the method that handles this event.

For example, the description of the Button server component (button) included in the form template will look like this: & lt; asp: Button id = Button1 text = Button onclick = "Button1_Click" runat- server ''/& gt;

As you can see from this example, after the prefix asp: follows the type of the Button control that corresponds to the Button class described in

.NET Framework; the value of the id attribute specifies the name of the Buttonl object, with which it can be accessed in the program code; The text attribute is used to set the corresponding property for the Button1 object, and the onclick attribute specifies the name of the method that handles the click event.

All event handlers for the event must have a standard signature (same as for Windows EI). For example, the event handler for a button click can have the following appearance:

protected void Button1_Click (object sender, EventArgs e) {

Labell.Text = Good day + TextBoxl.Text +

Label 1 .Visible = true:

}

All server ECUs, as well as the Page class, are derived from the Control base class from the System.Web.UI namespace, so they all inherit its properties and methods (Table 4.3).

Table 4.3

Basic properties and methods of the base class Control

Property

Description

ID

The name of the EC that can be accessed by it

Page

A reference to the Rade object that contains this EA

Parent

A reference to the parent object (the Rade or Control) that contains this ECU

Visible

A boolean variable that specifies whether to show the given EC on the form; if false, the EC is invisible on this page

Controls

A collection of ECUs located on a web-form or in the EC. A control (for example, the Panel) contained in this collection can itself include its child ECUs

BackColor

Get or set a background color

BorderColor

Get or set a border color

BorderStyle

One of the values ​​of the BorderStyle: Dashed enumeration. Dotted. Double. Groove. Ridge. Inset, Outset. Solid and None

BorderWidth

Get or set the width of the border

CssClass

Specifies the CSS style class used by the EO

Enabled

Gets or sets the status of the EUT. If false, the element is inactive and is shown in gray

Font

Returns an object with information about the font used for the UI that displays the text

ForeColor

Get or set the color of the EO

Tooltip

Get a text message that is displayed when the user drags the mouse over an EV data

Height

Get or set the height of the EC

Width

Get or set the ECU width

FindControl ()

Search for the child EC with the given name in the current EC and in all the ECUs contained in it. If such an ECU child is found, a general type reference is returned, which must be converted to the required type

HasCon -

trols ()

Check if the given EC has child ECUs. This ECU must be a container EC in order to have child ECs (for example, like a Panel)

DataBind ()

Binding of EC and all of its child ECs to a given data source

RenderControl ()

Formation of HTML-code for a given EC based on the current state. This method is directly called, and it is called by the Rade object when creating the HTML of the entire page.

Control events

Each server ECU has a set of events associated with it. When the user performs some actions with the corresponding HTML-code, events are triggered. All server-side events are divided into two types:

action events , which cause the request to be sent back to the web server immediately, for example, the Click event of the Button's EC;

change events , which by default do not cause an immediate request to be sent back to the web server, examples of such events are TextChanged (change text in a TextBox), CheckedChanged ( change the state of a CheckBox) or SelectedlndexChanged (change the selected item in a ListBox or ComboBox).

Change events do not cause a return to the web server for immediate processing. Their processing will be performed after the event-action occurs (by default this is a click of the submit button). However, when processing events on the server, the event-changes are processed first (not in the order they appear in the browser, but in the order of the corresponding ECs in the template), and only then the action event is processed.

Event-change control can be made an action-event. To do this, in the description of this EC you need to set the attribute

AutoPostBack-'true & quot ;. In this case, if a change event occurs in the browser, an immediate reverse send will be performed (this is done using a script that causes the form data to be sent to the server). For example, if you include the attribute AutoPostBack- true in the description of the TextBox power:

& lt; asp: TextBox ID = "TextBox1 '" runat-'server AutoPostBack = True & gt;

Ivanov Peter & lt;/asp: TextBox & gt;

then when the content of this element is changed and the transition to another EA takes place, the event-action that leads to the return sending of the request to the server will be executed.

Classifying Web server controls

In ASP.Net, there are a lot of server-side web-based EAs. It is not possible to quickly master all server ECs. In this regard, it is important to understand their classification and possible applications. Server web-EE can be classified by their form and by the functions performed.

The server web controls can be divided into the following groups by functions:

Standard Controls (Standard group) for creating a basic interface;

Test Controls (Validation group) that allow you to verify user-entered data on the server and client side;

navigation controls (the Navigation group) through the web application, allowing you to organize user transitions between the application's web forms for various tasks;

data controls (Data group) that allow you to show and organize the work of users with databases;

Userprotection security controls (Login group) with web applications, allowing users to authenticate and authorize.

Each web control generates HTML code as a result of processing the web form, which is included in the response to the user, and it also has a set of properties and events.

Composite controls

In form all server EC can be divided into simple and composite. Composite ECs can include sub-elements that describe the data used and the template for their display. An example of a composite EC is list (list contros), which show a given list of data items or a set of items from a data source (records) using a fixed template for each of them. All list-based ECs are inherited from the base class of the ListControl and provide a fixed, in-built data element mapping template. Listed ECs can include asp: Listltem sub-elements that contain a single list value.

Listed power plants are:

• ListBox - shows a list of items from which the user can select one or more;

• DropDownList - drop-down list of elements (combo box);

• CheckBoxList - list of checkboxes for which you can set the status selected/not selected & quot ;;

• RadioButtonList - list of alternatives from which the user can select one value;

• BulletedList - a bulleted list of elements.

The display of each data element is determined by the type of the list management. For example, a bulleted list can be described as follows:

& lt; asp: BulletedList runat- server bulletstyle = Square '' & gt;

& lt; asp: Listltem> Once & lt;/asp: Listltem & gt;

& lt; asp: Listltem> Two & lt;/asp: Listltem & gt;

& lt; asp: Listltem> Three & lt;/asp: Listltem & gt;

& lt;/asp: BulletedList & gt;

Further in the manual, other composite EAs will be considered, especially when explaining how to work with data, for example, GridView and ListView.

Standard controls

A description of some standard web-based ECUs is given in Table. 4.4.

Table 4.4

Basic classes of standard web-based ECU

Server Management Tag

Generated

HTML code

Basic Properties and Events

& lt; asp: Button & gt;

input type = submit'7 & gt; or

input type = button7 & gt;

Text, CausesValidation, PostBackUrl, ValidationGroup; event: Click

& lt; asp: CheckBox & gt;

input

type = checkbox7 & gt;

AutoPostBack, Checked, Text, TextAlign: event: CheckedChanged

& lt; asp: Filellpload & gt;

& lt; input type = file & gt;

FileBytes, FileContent, FileName, HasFile, PostedFile; Method: SaveAsQ

& lt; asp: lmage & gt;

& lt; img/& gt;

AlternateText, ImageAlign, ImageUrl

& lt; asp: lmageButton & gt;

& lt; input type = image /& gt;

CausesValidation, ValidationGroup; Event Click

& lt; asp: lmageMap & gt;

& lt; map & gt;

HotSpotMode, HotSpots (collection), AlternateText, ImageAlign, ImageUrl

& lt; asp: HiddenField & gt;

& lt; input type-'hidden & gt; & gt;

Value

& lt; asp: HyperLink & gt;

& lt; a & gt; ... & lt;/a & gt;

ImageUrl, NavigateUrl, Target, Text

& lt; asp: Label & gt;

& lt; span & gt; ... & lt;/span & gt;

Text, AssociatedControllD

& lt; asp: LinkButton & gt;

& lt; a & gt; & lt; img/& gt; & lt;/a & gt;

Text, CausesValidation, Validation- Group: event Click

& lt; asp: Panel & gt;

& lt; div & gt; ... & lt;/div & gt;

BacklmageUrl, DefaultButton, GroupingText, HorizontalAlign, Scrollbars, Wrap

& lt; asp: RadioButton & gt;

& lt; input type = radio /& gt;

AutoPostBack, Checked, GroupName, Text, TextAlign: Event CheckedChanged

& lt; asp: Panel & gt;

& lt; div & gt; ... & lt;/div & gt;

BacklmageUri, DefaultButton, GroupingText, HorizontalAlign, Scrollbars, Wrap

& lt; asp: RadioButton & gt;

input type = radio'7 & gt;

AutoPostBack, Checked, GroupName, Text, TextAlign; Event CheckedChanged

& lt; asp: TextBox & gt;

input type = text /& gt; or textarea & gt; ... /textarea & gt;

AutoPostBack, Columns, MaxLength, Readonly, Rows, Text, TextMode, Wrap; event TextChanged

Also We Can Offer!

Other services that we offer

If you don’t see the necessary subject, paper type, or topic in our list of available services and examples, don’t worry! We have a number of other academic disciplines to suit the needs of anyone who visits this website looking for help.

How to ...

We made your life easier with putting together a big number of articles and guidelines on how to plan and write different types of assignments (Essay, Research Paper, Dissertation etc)