Chapter 16 - Dynamic HTML: Data Binding with Tabular Data Control Outline 16.1 Introduction 16.2 Simple Data Binding 16.3 Moving within a Recordset 16.4 Binding to an img 16.5 Binding to a table 16.6 Sorting table Data 16.7 Advanced Sorting and Filtering 16.8 Data Binding Elements 16.9 Web Resources

In this lesson, you will learn: Objectives In this lesson, you will learn: To understand Dynamic HTML’s notion of data binding and how to bind data to XHTML elements. To be able to sort and filter data directly on the client without involving the server. To be able to bind a table and other XHTML elements to data source objects (DSOs). To be able to filter data to select only records appropriate for a particular application. To be able to navigate backward and forward through a database with the Move methods.

Data Source Objects (DSOs) 16.1  Introduction Data binding Data no longer reside exclusively on the server Data can be maintained on the client Eliminate server activity and network delays Data Source Objects (DSOs) Tabular Data Control (TDC)

16.2 Simple Data Binding Data file Header row Text qualifiers ( @ ) Specifies the names of the columns below Text qualifiers ( @ ) Enclose data in each field Field delimiter ( | ) Separate each field Recordset

HTMLStandardColors .txt (1 of 1)

introdatabind.html (1 of 4)

introdatabind.html (2 of 4)

introdatabind.html (3 of 4)

introdatabind.html (4 of 4)

16.3 Moving within a Recordset Moving through a recordset using JavaScript (Fig. 16.3)

moving.html (1 of 5)

moving.html (2 of 5)

moving.html (3 of 5)

moving.html (4 of 5)

moving.html (5 of 5)

Many different types of XHTML elements can be bound to data sources 16.4  Binding to an img Many different types of XHTML elements can be bound to data sources Binding to an img element Changing the recordset updates the src attribute of the image

images.txt (1 of 1)

binding.html (1 of 3)

binding.html (2 of 3)

binding.html (3 of 3)

Binding data to a table is perhaps the most important of data binding 16.5  Binding to a table Binding data to a table is perhaps the most important of data binding Different from the data binding we’ve seen

tablebind.html (1 of 2)

tablebind.html (2 of 2)

Manipulate a large data source 16.6  Sorting table Data Manipulate a large data source Need to sort data Can be accomplished by the Sort property of the TDC

sorting.html (1 of 3)

sorting.html (2 of 3)

sorting.html (3 of 3)

16.7 Advanced Sorting and Filtering Selecting data that meets a specific criteria Combined with TDC provides powerful data rendering

DBPublications.txt (1 of 1)

advancesort.html (1 of 7)

advancesort.html (2 of 7)

advancesort.html (3 of 7)

advancesort.html (4 of 7)

advancesort.html (5 of 7)

advancesort.html (6 of 7)

advancesort.html (7 of 7)

16.8  Data Binding Elements Exactly how a data source is displayed by the browser depends on the XHTML element to which the data is bound Different elements may use the data for different purposes.

16.8  Data Binding Elements