Creating Data-based Applications Using DHTML

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. CREATINGDATA-BASED
APPLICATIONSUSINGDHTML
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