Java Reference
In-Depth Information
The visual web table component automatically highlights any selected rows;
typically its status is updated after a server request that results in navigation to
the page containing the table. In order to have the table component refresh itself
and highlight any selected rows when a checkbox is clicked, we need to invoke a
JavaScript function provided by the Woodstock JSF components; the name of this
function is
initAllRows()
. We will write our own JavaScript function that will
invoke the
initAllRows()
function.
To do this, we need to drag a
Script
component from the
Advanced
section of the
palette to the
Head
component in the
Navigator
window.
Now we need to click on the
JSP
tab and add a JavaScript function to the tag.
<webuijsf:head id="head1">
<webuijsf:script id="script1">
function initAllTableRows() {
document.getElementById("form1:table1").initAllRows();
}
</webuijsf:script>
<webuijsf:link id="link1" url="/resources/stylesheet.css"/>
</webuijsf:head>
We named our JavaScript function
initAllTableRows()
. It obtains a reference to
the
table
element in the page's
Document Object Model
(
DOM
), then invokes
the Woodstock provided
initAllRows()
JavaScript function on it. After adding
our function, we need to invoke it whenever the row containing the checkboxes is
clicked; this can be done by adding the appropriate value to the column's
onClick
attribute. This can be done graphically from the
Properties
window or by directly
editing the page markup.