DHTML, or Dynamic HTML, is a combination of HTML, cascading style sheets (CSS), and JavaScript used to create dynamic and interactive web pages. With DHTML, you can make web page elements change without needing a full page reload, enhancing the user's experience.

1. CREATING DATA-BASED
APPLICATIONS USING DHTML
Computer Call
April 08, 1999

2. AGENDA
• Data Binding Overview
• IE5 Features

3. OVERVIEW
DATA SOURCE OBJECTS
• Provide an open model for
• Transporting data to/from a document
• Specification of the data
• Supplying methods to manipulate
the data on the client, e.g., sort, filter
• Script access to the data -
no predefined object model
• Placeholder for data events

4. OVERVIEW
HTML EXTENSIONS
• Four attributes reserved in the HTML 4.0 DTD
• DATASRC - data source object supplying data
• DATAFLD - the column/field in the data set
• DATAFORMATAS - specifies format of the data
• DATAPAGESIZE - # records to display in table
• Allow HTML to be used as template for data
• Demo of TDC

5. OVERVIEW
SUPPORTED ELEMENTS
• DIV
• SPAN
• PARAM/OBJECT
• PARAM/APPLET
• MARQUEE
• IMG
• TEXTAREA
• A
• FRAME
• IFRAME
• INPUT - TEXT
• INPUT - RADIO
• INPUT - CHECKBOX
• INPUT - HIDDEN
• INPUT - PASSWORD
• SELECT
• BUTTON
• LABEL
• LEGEND
• TABLE

6. DATASRC without DATAFLD
DATAPAGESIZE
DATAFORMATAS
OVERVIEW
SUPPORTED ELEMENTS
• DIV
• SPAN
• MARQUEE
• TABLE
• OBJECT/PARAM
• TABLE
• BUTTON
• LABEL
• APPLET/PARAM

7. OVERVIEW
BINDING/REPETITION AGENT
• Responsible for:
• Recognizing data providers
(DSOs) and data consumers
(HTML elements) on an HTML page
• Synchronizing data values
between data source objects
and data consumers
• Repeating the contents of a table
• Firing script events

8. IE5 FEATURES
• Increased Performance
• Master/Detail Hierarchical Bindings
• Multiple data members from a single Data Source Object
• 1st/Last Page on Paged Table
• Data Events

9. IE5 FEATURES
PERFORMANCE
• Repeated Tables render FASTER!
• Fixed width columns can be used to further increase
performance

10. IE5 FEATURES
MASTER/DETAIL BINDING
• Allows binding to lower levels in a hierarchy
• Uses separate table instead of nested table
• Similar to Access form/subform
• XML Data Source Object supplies the data
• Demo

11. IE5 FEATURES
MULTIPLE DATA MEMBERS
• Allows single DSO to supply multiple data sets for
binding
• Enables DSOs to supply related data sets
• Adds more flexibility to the binding process
• Demo

12. IE5 FEATURES
DATA EVENTS
• Fires on the data source object
• informational events - not cancellable
• used to do calculations when data changes occur out-
of-band
• onrowsinserted
• onrowsdelete
• oncellchanged
• Demo

13. IE5 FEATURES
EVENT OBJECT PROPERTIES
• recordset
• the recordset affected by the event
• dataFld
• the name of the column affected by the oncellchanged() event
• bookmarks collection
• ADO bookmarks for the rows being inserted, deleted, or which
have cell values that are changed
• boundElements collection
• all bound elements to the data set source of the event