 2004 Prentice Hall, Inc. All rights reserved. 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

 2004 Prentice Hall, Inc. All rights reserved. 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.

 2004 Prentice Hall, Inc. All rights reserved 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)

 2004 Prentice Hall, Inc. All rights reserved Simple Data Binding Data file –Header row Specifies the names of the columns below –Text qualifiers ) Enclose data in each field –Field delimiter ( | ) Separate each field –Recordset

 2004 Prentice Hall, Inc. All rights reserved. Outline HTMLStandardColors.txt (1 of 1)

 2004 Prentice Hall, Inc. All rights reserved. Outline introdatabind.html (1 of 4)

 2004 Prentice Hall, Inc. All rights reserved. Outline introdatabind.html (2 of 4)

 2004 Prentice Hall, Inc. All rights reserved. Outline introdatabind.html (3 of 4)

 2004 Prentice Hall, Inc. All rights reserved. Outline introdatabind.html (4 of 4)

 2004 Prentice Hall, Inc. All rights reserved Moving within a Recordset Moving through a recordset using JavaScript (Fig. 16.3)

 2004 Prentice Hall, Inc. All rights reserved. Outline moving.html (1 of 5)

 2004 Prentice Hall, Inc. All rights reserved. Outline moving.html (2 of 5)

 2004 Prentice Hall, Inc. All rights reserved. Outline moving.html (3 of 5)

 2004 Prentice Hall, Inc. All rights reserved. Outline moving.html (4 of 5)

 2004 Prentice Hall, Inc. All rights reserved. Outline moving.html (5 of 5)

 2004 Prentice Hall, Inc. All rights reserved.

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

 2004 Prentice Hall, Inc. All rights reserved. Outline images.txt (1 of 1)

 2004 Prentice Hall, Inc. All rights reserved. Outline binding.html (1 of 3)

 2004 Prentice Hall, Inc. All rights reserved. Outline binding.html (2 of 3)

 2004 Prentice Hall, Inc. All rights reserved. Outline binding.html (3 of 3)

 2004 Prentice Hall, Inc. All rights reserved.

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

 2004 Prentice Hall, Inc. All rights reserved. Outline tablebind.html (1 of 2)

 2004 Prentice Hall, Inc. All rights reserved. Outline tablebind.html (2 of 2)

 2004 Prentice Hall, Inc. All rights reserved.

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

 2004 Prentice Hall, Inc. All rights reserved. Outline sorting.html (1 of 3)

 2004 Prentice Hall, Inc. All rights reserved. Outline sorting.html (2 of 3)

 2004 Prentice Hall, Inc. All rights reserved. Outline sorting.html (3 of 3)

 2004 Prentice Hall, Inc. All rights reserved.

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

 2004 Prentice Hall, Inc. All rights reserved. Outline DBPublications.txt (1 of 1)

 2004 Prentice Hall, Inc. All rights reserved. Outline advancesort.html (1 of 7)

 2004 Prentice Hall, Inc. All rights reserved. Outline advancesort.html (2 of 7)

 2004 Prentice Hall, Inc. All rights reserved. Outline advancesort.html (3 of 7)

 2004 Prentice Hall, Inc. All rights reserved. Outline advancesort.html (4 of 7)

 2004 Prentice Hall, Inc. All rights reserved. Outline advancesort.html (5 of 7)

 2004 Prentice Hall, Inc. All rights reserved. Outline advancesort.html (6 of 7)

 2004 Prentice Hall, Inc. All rights reserved. Outline advancesort.html (7 of 7)

 2004 Prentice Hall, Inc. All rights reserved.

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.

 2004 Prentice Hall, Inc. All rights reserved Data Binding Elements