Now that you've learned the basics, you're ready for some of the advanced features of data binding that enable the construction of more sophisticated, application-like pages.
A data source object can enable the user to update the data it supplies. When the user updates the data in an element bound to the data source object, the binding agent will store the modified value in the data source object. The data source object can then save these changed values in the underlying data source.
Generally, data source objects support data updates by allowing the user to modify data values stored within the local cache. The data source object can then choose when to update the data in the underlying data source: data can be updated immediately or in batch mode. Changes to a single cell, to a single row, or to the entire data set can be cached. Which mode the data source object operates in will be based largely on whether a connection to the underlying data source is maintained. When the entire data set is cached, data source objects usually expose a method that Web authors can call in order to save the cached data.
RDS is an example of a data source object that provides the ability to update data. RDS works in conjunction with a server-side component that enables access to ODBC (Online Database Connectivity) data sources. RDS stores the entire data set (the result of a SQL query) in a local in-memory cache. In addition to storing the data, RDS stores concurrency information to resolve conflicts when multiple users modify the same data values simultaneously. Data changed by a user is sent with this concurrency information to a server component that performs the update to the database. RDS can be used to build sophisticated client/server applications using HTML and scripts.
NOTE: Examples of applications written using RDS can be found on the Microsoft Web site at www.microsoft.com/data. The server component can be obtained free at the same URL. The client component of RDS is an integral part of the Internet Explorer 4.0 browser and is installed with the minimal configuration of the browser.
The recordNumber property is available on all elements that are part of the template of a repeated table. Recall that when repeated table binding is used, the contents of the table are used as a template and repeated once for each record in the data set. Each instance of the repetition is called a template instance. For each element in a template instance (including elements that are not data bound, such as the <TR> and <TD> tags), recordNumber provides the record number from the data set that generated the element.
The recordNumber property corresponds directly to the AbsolutePosition property of the ADOR recordset. By using recordNumber to set AbsolutePosition on the recordset, the Web author can access additional data elements from the same column of the data set. You need to set the AbsolutePosition property because ADOR allows access only to fields in the current record.
The recordNumber property is not a bookmark; recordNumber changes as a result of rows being inserted or deleted from the local client cache. Using ADOR, however, the Web author can obtain a bookmark for the column by using the recordNumber property:
<SCRIPT LANGUAGE="JavaScript"> var clone_rs = stocklist.recordset.clone(); clone_rs.AbsolutePosition = textbox1.recordNumber; var bkmk = clone_rs.Bookmark; </SCRIPT>
This bookmark always refers to the same record in the recordset, regardless of whether rows are inserted and deleted.
The recordNumber property can also be used to assist with navigating a collection of elements in a repeated table. You can uniquely name an element in HTML by including an ID attribute in the element's tag. When you name an element in the template of a repeated table, however, the result is a collection of elements with the same ID because the template is repeated for each record of the data set. The recordNumber property can be used in conjunction with a script to display details for the record corresponding to the selected element. For example, say that instead of viewing all of your stock data at once you want to view detailed data when you click on a particular stock. You can include selector buttons in the table to select a stock and then set the current record to the selected stock to display the detailed data using the following HTML:
<BODY TOPMARGIN=0 LEFTMARGIN=40 BGCOLOR="#FFFFFF"> <FONT FACE="verdana,arial,helvetica" SIZE=2> <H2>Record Number</H2> § <TABLE> <TR> <TD VALIGN=top> <TABLE ID="stocktbl" DATASRC="#stocklist" BORDER=1> <THEAD> <TR ONCLICK="sort();"> <TD> <TD CLASS=thd><DIV ID=Symbol>Symbol</DIV></TD> <TD CLASS=thd><DIV ID=Last>Shares</DIV></TD> <TD CLASS=thd><DIV ID=Volume>Volume</DIV></TD> </TR> </THEAD> <TBODY> <TR> <TD> <BUTTON CLASS=sb ONCLICK="setrn(this);"> <B>show</B> </BUTTON> </TD> <TD><A DATASRC="Website"><SPAN DATAFLD="Symbol"> </SPAN></A> </TD> <TD ALIGN=right><DIV DATAFLD="Shares"></DIV></TD> <TD ALIGN=right> <SPAN DATAFLD="Volume" DATAFORMATAS=HTML> </SPAN> </TD> </TR> </TBODY> </TABLE> </TD> <TD VALIGN=top> <B>Company Name:</B> <SPAN DATASRC="#stocklist" DATAFLD="CompanyName"> </SPAN> <BR> <B>Last Updated:</B> <SPAN DATASRC="#stocklist" DATAFLD="DateUpdated"> </SPAN> <BR> <B>Open:</B> <SPAN DATASRC="#stocklist" DATAFLD="Open"> </SPAN> <BR> <B>High:</B> <SPAN DATASRC="#stocklist" DATAFLD="High"> </SPAN> <BR> <B>Low:</B> <SPAN DATASRC="#stocklist" DATAFLD="Low"> </SPAN>
<BR>
<B>PE Ratio:</B>
<SPAN DATASRC="#stocklist" DATAFLD="PERatio">
</SPAN>
<BR>
<B>Chart:</B>
<IMG ALIGN=top DATASRC="#stocklist" DATAFLD="Chart">
</SPAN>
</TR>
</TABLE>
§
<SCRIPT LANGUAGE="JavaScript">
function setrn(button) {
stocklist.recordset.AbsolutePosition = button.recordNumber;
}
</SCRIPT>
</BODY>
Figure 15-5 shows how the details are displayed next to the table.
Figure 15-5. Using the recordNumber property to display details from a single record in a repeated table.
Dynamic HTML exposes properties that correspond to the attributes and styles on the tags for HTML elements. The data-binding attributes are no exception. The Web author has the full capability to add, delete, and modify the data-binding properties on HTML elements after the page has been rendered. Moreover, using Dynamic HTML the Web author can also add data source objects to and delete data source objects from the page.
The one caveat to this correspondence is that the DATASRC, DATAFLD, and DATAFORMATAS attributes cannot be modified on elements within a repeated table. You can get around this limitation by changing the table to a standard HTML table. First remove the DATASRC attribute from the table. The table reduces to a nonrepeated state and includes only the template. The elements within the template, although not bound, can then be modified. DATASRC can then be added back to the table to reinstate the repetition. Using the multimedia extensions of Internet Explorer 4.0, the Web author can also suspend redisplay of the table so that this series of steps occurs without multiple redraws.
NOTE: Additional information about data binding can be obtained from the Internet Explorer 4.0 section of the Microsoft Web site at www.microsoft.com. Examples can also be found at the same location.