Tut2 ses3
-
Upload
mallikamt -
Category
Technology
-
view
237 -
download
4
Transcript of Tut2 ses3
![Page 1: Tut2 ses3](https://reader036.fdocuments.in/reader036/viewer/2022083003/558eba811a28ab8b1f8b458c/html5/thumbnails/1.jpg)
Table Binding
• Using table data binding, each record can be displayed in a different row of a table. The syntax is:
<table datasrc=“#id”> <tr> <td><span datafld=“field1”></span></td> <td><span datafld=“field2”></span></td> </tr> </table>
![Page 2: Tut2 ses3](https://reader036.fdocuments.in/reader036/viewer/2022083003/558eba811a28ab8b1f8b458c/html5/thumbnails/2.jpg)
Table Binding
• In the example, id is the name of the data island, field1, field2 are the fields from the recordset.
![Page 3: Tut2 ses3](https://reader036.fdocuments.in/reader036/viewer/2022083003/558eba811a28ab8b1f8b458c/html5/thumbnails/3.jpg)
Page Binding
• As you add more records to your XML document, a table can become long and unwieldy. One way to fix this is to give the user the option of limiting the number of records displayed at any one time.
• The user can then move forward of backward that number of records at a time. This is called paging.
![Page 4: Tut2 ses3](https://reader036.fdocuments.in/reader036/viewer/2022083003/558eba811a28ab8b1f8b458c/html5/thumbnails/4.jpg)
Page Binding
• To specify the page size, add the dataPageSize attribute to the <table> tag:
dataPageSize=“number”
• number is the number of records you want displayed in a single page.
![Page 5: Tut2 ses3](https://reader036.fdocuments.in/reader036/viewer/2022083003/558eba811a28ab8b1f8b458c/html5/thumbnails/5.jpg)
Navigating a Table Page
• A unique identifier must be assigned to a table using the ID attribute before writing a command to navigate a table page. The syntax to do this is:
<table id=“id”>
• Here, id is the name you assign to the table object.• This is needed because the commands to navigate
the table pages act on the table itself not the recordset.
![Page 6: Tut2 ses3](https://reader036.fdocuments.in/reader036/viewer/2022083003/558eba811a28ab8b1f8b458c/html5/thumbnails/6.jpg)
Table Methods and Properties
These figures show some table methods and properties
![Page 7: Tut2 ses3](https://reader036.fdocuments.in/reader036/viewer/2022083003/558eba811a28ab8b1f8b458c/html5/thumbnails/7.jpg)
Table Methods and Properties
• To run these commands, add the command to the onClick event handler of a <button> tag. For example, to move to the last page in a data table named “StaffTable”, you enter the attribute:
onClick=“StaffTable.lastPage( )”
![Page 8: Tut2 ses3](https://reader036.fdocuments.in/reader036/viewer/2022083003/558eba811a28ab8b1f8b458c/html5/thumbnails/8.jpg)
Hierarchical Records
This figure shows the layout of the EMP2.XML document
![Page 9: Tut2 ses3](https://reader036.fdocuments.in/reader036/viewer/2022083003/558eba811a28ab8b1f8b458c/html5/thumbnails/9.jpg)
Hierarchical Records
• To bind the Employee fields in the previous slide to a table, you create a table as follows:
<table datasrc=“#Staff_Info” datafld=“Employee”> <tr> <td><span datafld=“Name”></span></td> <td><span datafld=“Position”></span></td> <td><span datafld=“Phone”></span></td> … </tr> </table>
![Page 10: Tut2 ses3](https://reader036.fdocuments.in/reader036/viewer/2022083003/558eba811a28ab8b1f8b458c/html5/thumbnails/10.jpg)
Draft of the Final Web Page
This figure shows the draft of the final Web page
employee information grouped by department
![Page 11: Tut2 ses3](https://reader036.fdocuments.in/reader036/viewer/2022083003/558eba811a28ab8b1f8b458c/html5/thumbnails/11.jpg)
The Final Web Page
This figure shows the final Web page