[Javascript] click in table 1 rows the second table change ??

[Paul Novitski]

At 09:42 PM 8/10/2006, Majid L wrote:
>I am trying to have in my jsp page two tables :
>
>  First table : Select the package  :
>  row1
>  row2
>  row3
>  ...
>  row10
>
>  each time the user select a row, the rows in the second table change
>:
>  for example if the user click in row2 the second table will be like
>this :
>
>  Second Table : Select the page to print :
>  row2Page1
>  row2Page2
>  ...
>  row2Page6


There are several ways to do this, including:

Client-side solutions:

- Download the page with all the possible secondary tables already 
marked up, but hide all but one secondary table using CSS.  When the 
user clicks on a row in the first table, hide the current second 
table and display the next second table.

- Download the page with just two tables, but all the possible 
secondary table information in javascript arrays.  When the user 
clicks on the first table, replace the cell data in the second table 
from the corresponding array.

Server-side solutions:

- Make the cells in your first table hyperlinks.  When you click on 
one, the page reloads with the second table populated with the 
correct data.  This is a server-side solution.

- When you click on the first table, use the JavaScript 
XMLHttpRequest to download the new contents of the second table and 
replace the cell contents.

What you are doing with tables, many people accomplish using 
lists.  You can find many examples of this on the internet, e.g. if 
you google "javascript dynamic lists".  Here's one:

Complex Dynamic Lists: Your Order Please
by Christian Heilmann
http://www.alistapart.com/articles/complexdynamiclists/


Regards,
Paul