javascript dynamic list without sucking

TeeJay on 2006-12-05T15:11:38

After wasting too long mucking about with something else I found this..

http://www.bobbyvandersluis.com/articles/unobtrusivedynamicselect.php

.. and it worked in a couple of minutes, and it's only a handful of LoC.. sweet.

Maybe I should ask him if I can upload it to JSAN as it's sorely lacking that simple functionality in any of it's current packages.


It could be a lot simpler still.

bart on 2006-12-14T22:21:30

Really.

Get his example HTML page from http://www.bobbyvandersluis.com/articles/unobtrusivedynamicselect/unobtrusivedyn amicselect_ex5.html, rip out his Javascript, and instead, put this CSS and in the header of the file.

<style type="text/css">
#pda-type option { display: none }
#pda-type option.select,
.hp#pda-type option.hp,
.dell#pda-type option.dell,
.palmone#pda-type option.palmone
  { display: block }
</style>
And put this bit of Javascript in the onChange attribute for the first dropdown:

onchange="document.getElementById('pda-type').className=this.value"
That's all there is to it. It'll do the same as his does, but with a lot less voodoo. Promised.

Re:It could be a lot simpler still.

bart on 2006-12-14T22:25:17

Oopsie, I just tried it in MSIE 6, and it doesn't work there, dammit. It does work in Firefox 1.5.