Tài liệu Working with controls ppt

 use HTML controls or turn off state management for bound server controls.. Server Controls and HTML ControlsDisplay text Label, TextBox, Literal Label, Text Field, Text Area, Password

Working with controls

Hà Đồng Hưng

• Data Binding with controls

– Simple Data Binding – Data Binding with Database

• Validation controls

• Other controls

• Data Binding with controls

– Simple Data Binding – Data Binding with Database

• Validation controls

• Other controls

Server controls vs HTML controls

Server events Trigger control-specific events on the server. Can trigger only page-level events on server (post-back)

State

Management Data entered in a control is maintained across requests

Data is not maintained; must be saved and restored using page-level scripts

Adaptation Automatically detect browser and adapt display as appropriate. No automatic adaptation; must detect browser in code or write

for least common denominator

Properties

The NET Framework provides a set of properties for each control Properties allow you to change the control' s appearance and behavior within server-side code

HTML attributes only

Using HTML controls ???

Use HTML controls for the following reasons:

• Migration from earlier versions of ASP

• Not all controls require server-side events or state

management

– This is particularly true when doing data binding Bound items are

usually refreshed from the data source with each request, so it is more efficient not to maintain state information for bound controls.

 use HTML controls or turn off state management for bound server controls.

• You have complete control over what is rendered with HTML

controls

– <asp:TextBox id="txtText" runat="server"></asp:TextBox>

– <INPUT type="text" id="textfield1">

– <asp:Button id="btnShow" runat="server"

Text="Show"></asp:Button>

– <INPUT type="button" value="Show">

Server Controls and HTML Controls

Display text Label, TextBox, Literal Label, Text Field, Text Area, Password Field

commands Button, LinkButton, ImageButton Button, Reset Button, Submit Button

Set values CheckBox, CheckBoxList, RadioButton, RadioButtonList Checkbox, Radio Button

Display

Navigation Hyperlink none (use <a> tags in text)

Server Controls and HTML Controls

Group controls Panel, Placeholder Flow Layout, Grid Layout

Validate data RequiredFieldValidator, CompareValidator, RangeValidator, RegularExpressionValidator,

CustomValidator,ValidationSummary

none (use level)

• Data Binding with controls

– Simple Data Binding – Data Binding with Database

• Validation controls

• Other controls

• Buttons (Button, LinkButton, ImageButton)

– <asp:Button id="Button1" runat="server"

Text Get or set the data in the TextBox.

TextMode Display SingleLine, MultiLine (scrollable), or Password text

Enabled Enable/Disable the TextBox

Visible Show/Hide the TextBox

ReadOnly Prevent the user from changing the text

AutoPostBack When set to True, causes the TextBox to fire a TextChanged post-back event when the user leaves the TextBox after changing the

contents

• Label, Buttons

– Text property

• TextBox

Recheck TextBox properties

If txtUser.Text = "Guest" And txtPassWord.Text = "Moon" Then Response.Redirect("Webform2.aspx")

Else

txtUser.ReadOnly = True

txtPassword.ReadOnly = TrueWrite code to do

these:

• Data Binding with controls

– Simple Data Binding – Data Binding with Database

• Validation controls

• Other controls

ListBox Display read-only text in a simple scrollable list format.

DropDownList Display read-only text in a simple drop-down list format

Table Display text and controls in columns and rows Table controls allow you to dynamically build tables in code

using TableRows and TableCells collections

List Controls: HTML tags

List Controls

Add items at Run Time

List Controls

Add items at Run Time

• ListBox and DropDownList:

– Store the items you add to them at run time

– Use the Add method on the control' s Items collection

– Steps:

Private Sub butAdd_Click(ByVal sender As System.Object, _

ByVal e As System.EventArgs) Handles butAdd.Click ListBox1.Items.Add(txtSource.Text)

DropDownList1.Items.Add(txtSource.Text)

End Sub

• Table

– Store data only for the table cells created at design time

– To create additional rows and cells at run time, you need to rebuild the table from information stored in a state variable

List Controls

Getting the Selected Item

List Controls

Getting the Selected Item

• Use the SelectedItem property to get the current selection from a list

Private Sub Page_Load(ByVal sender As System.Object, _

ByVal e As System.EventArgs) Handles MyBase.Load

' Test if there is a selected item.

If Not IsNothing(ListBox1.SelectedItem) Then

' Display the selected item.

Label1.Text = "The selected item is: " _

• Data Binding with controls

– Simple Data Binding – Data Binding with Database

• Validating controls

• Other controls

Data Binding

Simple Data Binding

Data Binding

Simple Data Binding

• Binding data with all common controls (except DataList,

DataGrid, Repeater, Table)

• Steps:

– 1 Define the DataSource

– 2 Use the DataBindings dialog box to load items from any

public data source to list or table controls (DataSource 

Custom Binding Expression  type DataSourceName)

– 3 Call Page.DataBind() in Page_Load

Simple Data Binding Example

Public arrData As String() = {"This", "that", "and", _

"the", "other"}

Private Sub Page_Load(ByVal sender As System.Object, _

ByVal e As System.EventArgs) Handles MyBase.Load

' Bind data to controls on this page.

Data Binding

DataGrid, DataList, and Repeater

Data Binding

DataGrid, DataList, and Repeater

• These three controls use templates to define their appearance at run

time

• A template is a set of HTML elements or server controls, or both, that

will be repeated for each data item in the control

• Steps:

– 1 Define the data source.

– 2 Draw the DataGrid, DataList, or Repeater control and bind to

the data source.

– 3 Edit the templates in the control to add HTML elements or

server controls that will be repeated within the list or grid.

– 4 Set the properties of the server controls contained in the list or

grid to bind to data items in the container' s data source.

Data Binding tips

• Data sources can be any public data: a database table, an array, a property of an object, or an expression combining several items

• When using data binding with a server control, can turn off

state management for that control (  improves performance

because the DataBind method replaces the automatic view state

management provided by ASP.NET).

– To turn off state management for a server control, set the

control' s EnableViewState property to False.

• Data Binding with controls

– Simple Data Binding – Data Binding with Database

• Validation controls

• Other controls

Validation controls

client before the page is posted back to the server

RequiredFieldValidator Check if a control contains data

CompareValidator Check if an entered item matches an entry in another control

RangeValidator Check if an entered item is between two values

RegularExpressionValidator Check if an entered item matches a specified format

CustomValidator Check the validity of an entered item using a client-side script or a server-side code, or both

ValidationSummary Display validation errors in a central location or display a general validation error description

How to use Validation Controls

– Draw a validation control on a Web form and set its

ControlToValidate property to the control you want to validate

– Set the ErrorMessage property

– Set the Text property

– Use ValidationSummary control to display all error

messages one place

Validation controls Example

• Set the validation control' s ErrorMessage

• Using a ValidationSummary control • Using ValidationSummary control' s with ShowMessage=True

Giới thiệu VMWare Workstation 29

Cancel Validation

– provide a Submit HTML control

<INPUT id="butCancel" onclick="Page_ValidationActive=false;"

type="submit" value="Cancel">

– The button definition cancels validation and posts the page back

to the server

– Revalidate the page

– Check the IsValid property in the Page_Load event procedure

Private Sub Page_Load(ByVal sender As System.Object, _ ByVal e As System.EventArgs) Handles MyBase.Load

' Validate in case user cancelled validation

If Page.IsPostBack Then Page.Validate() ' Check if page is valid

If Not Page.IsValid Then ' User cancelled operation, return home

Response.Redirect("default.htm")

Customize Validation

and (optionally) on the client side

– place your validation code in the ServerValidate event

procedure

– specify a validation script in the CustomValidator control' s

ClientValidationFunction property

• Data Binding with controls

– Simple Data Binding – Data Binding with Database

• Validation controls

• Other controls

Other controls

• Getting and Setting Values

– RadioButton, RadioButtonList, CheckBox, CheckBoxList

• Grouping Controls

– Panel

• Displaying Graphics and Advertisements

– Background, Foreground, Image, AdRotator

• Getting Dates

– Calendar

• Getting Files from the Client

– File Field HTML control

• Use the Checked property to get the setting

Private Sub Button1_Click(ByVal sender As System.Object, _

ByVal e As System.EventArgs) Handles Button1.Click

If (CheckBox1.Checked = True) Then

Response.Write("Checkbox1 is CHECKED") End If

End Sub

• All RadioButtons must have the same GroupName

the Panel control in the

order you want them

displayed

place the controls where

you want them to appear

Other controls:

Calendar

Other controls:

Calendar

• Use the Calendar control to

get or display date

information

• To get or set dates selected

on the Calendar control, use

the SelectionChanged

event procedure and the

SelectedDate or

SelectedDates properties

Other controls:

File Field HTML control

Other controls:

File Field HTML control

• Use the File Field HTML

control to upload files from the

client to the server

• File Field HTML control = Text

Field HTML control + Submit

Button HTML control

• Clicking the Browse button

runs a built-in script that

displays the Windows Choose

File dialog box on the client' s

computer