Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Chris Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Javascript Dynamic Table

Status
Not open for further replies.
wreded

wreded

Technical User
Dec 18, 2001
119
US
i've searched all over for this with no real results yet. i'm trying to build a dynamic table from a single dropdown box. The dropdown has well over 200 <option>s and there are well over 200 matching <option>s to display, some consisting of a single line and some with 5-6 lines. Right now i have them displaying in a textbox which i consider workable, but not optimum. It doesn't match the rest of the pages and could be confusing to the end user.
There are a couple of caveats to this; i do not have access to the <head> nor <body> sections of the pages. i guess You could say i'm a contributor rather than a designer. i think i need a pure Javascript solution since i cannot put anything in the <head> or <body> sections.
Any ideas?
Thanks,
Dave
 
Sort by date Sort by votes
If the dropdown that you build the table from is on the same page, you're pretty much stuck with client-side Javascript, otherwise I'd suggest server-side programming to avoid problems from viewers with scripting disabled.

I'd suggest building the entire table in HTML as the page loads and creating all the rows initially with style="display:none". Then, based on the choice from the master dropdown, you can go through the IDs and set the display to either block or none based on the choice the user makes. You'll need to set the display on all of the <tr>s each time because the user may have changed their choice, necessitating removing previously displayed items.

Alternately, you could have an empty <div> on the page and build the table dynamically inside that each time a choice was made, but that would be slower than changing the display of the rows. I've done both and prefer the former.

Lee
 
Upvote 0 Downvote
Server-side is also a no-go. This has to be a strictly internal-to-the-page Javascript solution. i'm unfamiliar with the style="display:none" and that could be an option. How does that work? Can You point me in the right direction?
Just in case, can You also point me to the empty <div> solution You also mention?
Thanks,
Dave
 
Upvote 0 Downvote
Try Google for a variety of examples of answers to your questions. What you've asked is pretty basic HTML and CSS.

Lee
 
Upvote 0 Downvote
Ok, thanks for Your input. Got it working like i want, straight Javascript. Lots of "<td>"s and "</td>"s, but it works well.
Dave
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

lexer
  • Locked
  • Question
Passing fields from (html-JavaScript) table to JavaScript Function
Replies
0
Views
626
lexer
lexer
Mike Lewis
  • Locked
  • Question
Anyone here got any experience of Grid.JS (a sortable Javascript grid) 1
Replies
5
Views
1K
Mike Lewis
Mike Lewis
JScannell
  • Locked
  • Question
Javascript events
Replies
1
Views
255
Daniel K
Daniel K
JScannell
  • Locked
  • Question
Javascript issue on iPhone/iMac platforms
Replies
0
Views
613
JScannell
JScannell
malpa
  • Locked
  • Question
Graph the selection of a html table row
Replies
0
Views
649
malpa
malpa

Part and Inventory Search

Sponsor

Back
Top