DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
Chapter 6
1. • Benefits of Web Controls
• Basic Web Controls
• Web Control Class Properties
• Common Web Control Concepts
• List Controls
• Table Controls
• Web Control Events
• PostBack AutoPostBack
• How Postback Events Work
• The Page Life Cycle
2. • Provide a rich user interface
• Provide a consistent object model
• Tailor their output automatically
• Provide high-level features
3.
4.
5. ASP.NET tags have a special format. They always
begin with the prefix asp: followed by the class name.
If there is no closing tag, the tag must end with />.
<asp:TextBox ID="txt" BackColor="Yellow" Text="Hello World"
ReadOnly="True" TextMode="MultiLine" Rows="5" runat="server" />
6.
7. Most web controls begin by inheriting from the WebControl base class.
This class defines the essential functionality for tasks such as data
binding and includes some basic properties that you can use with
almost any web control
Property Description
AccessKey Specifies the keyboard shortcut as one letter. For example,
if you set this to Y, the Alt+Y keyboard combination will
automatically change focus to this web control.
BackColor, Sets the colors used for the background, foreground, and
ForeColor, border of thecontrol. In most controls, the foreground color
and BorderColor sets the text color.
BorderWidth Specifies the size of the control border.
BorderStyle One of the values from the BorderStyle enumeration,
including Dashed, Dotted, Double, Groove, Ridge, Inset,
Outset, Solid, and None.
Controls Provides a collection of all the controls contained inside
the current control
8. Property Description
Enabled When set to false, the control will be visible, but it will not be
able to receive user input or focus.
EnableViewState Set this to false to disable the automatic state management for
this control
Font Specifies the font used to render any text in the control as a
System.Web.UI.WebControls.FontInfo object.
Height and Width Specifies the width and height of the control. For some controls,
these properties will be ignored when used with older browsers.
ID Specifies the name that you use to interact with the control in
your code
Page Provides a reference to the web page that contains this control
as a system.Web.UI.Page object.
Parent Provides a reference to the control that contains this control.
TabIndex A number that allows you to control the tab order.
ToolTip Displays a text message above the control
Visible When set to false, the control will be hidden.
9. All the properties require the Unit structure, which combines
a numeric value with a type of measurement (pixels,
percentage, and so on.
<asp:Panel Height="300px" Width="50%" ID="pnl" runat="server" />
pnl.Height = Unit.Pixel(300);
pnl.Width = Unit.Percentage(50);
// Create a Unit object.
Unit myUnit = new Unit(300, UnitType.Pixel);
// Assign the Unit object to several controls or properties.
pnl.Height = myUnit;
pnl.Width = myUnit;
10. Enumerations are used heavily in the .NET class library to
group a set of related constants. For example, when you set
a control’s BorderStyle property, you can choose one of
several predefined values from the BorderStyle enumeration.
ctrl.BorderStyle = BorderStyle.Dashed;
<asp:Label BorderStyle="Dashed" Text="Border Test" ID="lbl"
runat="server" />
11. The Color property refers to a Color object from the
System.Drawing namespace. You can create color objects
in several ways:
Using an ARGB (alpha, red, green, blue) color value:
int alpha = 255, red = 0, green = 255, blue = 0;
ctrl.ForeColor = Color.FromArgb(alpha, red, green, blue);
Using a predefined .NET color name:
ctrl.ForeColor = Color.Crimson;
Using an HTML color name:
ctrl.ForeColor = ColorTranslator.FromHtml("Blue");
12. ctrl.Font.Name = "Verdana";
ctrl.Font.Bold = true;
You can also set the size using the FontUnit type:
// Specifies a relative size.
ctrl.Font.Size = FontUnit.Small;
// Specifies an absolute size of 14 pixels.
ctrl.Font.Size = FontUnit.Point(14);
13. Unlike HTML server controls, every web control provides a
Focus() method. The Focus() method affects only input
controls
<form DefaultFocus="TextBox2" runat="server">
Another way to manage focus is using access keys. For
example, if you set the AccessKey property of a TextBox
to A, pressing Alt+A focus will switch to the TextBox.
The following label gives focus to TextBox2 when the
keyboard combination Alt+2 is pressed:
<asp:Label AccessKey="2“ AssociatedControlID="TextBox2"
runat="server“ Text="TextBox2:" />
14. .
The default button is the button that is “clicked” when the
user presses the Enter key.
To designate a default button, you must set the
DefaultButton property with the ID of the respective
control, as shown here:
<form DefaultButton="cmdSubmit" runat="server">
15. The list controls include the ListBox, DropDownList,
CheckBoxList, RadioButtonList, and BulletedList.
Multiple-Select List Controls
Some list controls can allow multiple selections.
It is supported for a ListBox, provided you have set the
SelectionMode property to the enumerated value
ListSelectionMode.Multiple.
The user can then select multiple items by holding down the
Ctrl key while clicking the items in the list.
With the CheckBoxList, multiple selections are always
possible.
16. The Table control is built out of a hierarchy of objects.
Each Table object contains one or more TableRow objects.
In turn, each TableRow object contains one or more
TableCell objects.
17. Some events, such as the Click event of a button, do occur
immediately. That’s because when clicked, the button posts
back the page. However, other actions do cause events but
don’t trigger a postback.
An example is when the user changes the text in a text box
(which triggers the TextChanged event) or chooses a new item
in a list (the SelectedIndexChanged event).
You might want to respond to these events, but without a
postback your code has no way to run.
18. If you want to capture a change event (such as TextChanged,
CheckedChanged, or SelectedIndexChanged) immediately, you need to
set the control’s AutoPostBack property to true.
19.
20. ASP.NET also adds two additional hidden input fields that are
used to pass information back to the server. This information
consists of the ID of the control that raised the event and any
additional information that might be relevant. These fields are
initially empty, as shown here:
<input type="hidden" name="__EVENTTARGET"
id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT"
id="__EVENTARGUMENT" value="" />
Also ASP.NET generates the __doPostBack() function
automatically, provided at least one control on the page uses
automatic postbacks.
21. The __doPostBack() function has the responsibility for setting
these values with the appropriate information about the event
and then submitting the form. The __doPostBack() function is
shown here:
<script language="text/javascript">
function __doPostBack(eventTarget, eventArgument) {
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
...
}
</script>