gruss hawk,
Bin für jeden Tipp dankbar.
dann mal los, ich plaediere auch in diesem fall dafuer, ersteinmal zu
versuchen, die daten im html-code und nicht in einem JavaScript-objekt
abzubilden.
koennen kategorien z.b. unabhaengig voneinander dargestellt werden,
boete sich eine in zwei ebenen verschachtelte ungeordnete liste an:
<form ... >
...
<ul class="categoryRange">
<li><!-- class="category" //-->
<fieldset>
<legend>Automarke</legend>
<ul class="optionRange">
<li><!-- class="option" //-->
<label><input type="checkbox" .../>Volkswagen</label>
</li>
<li>
<label><input type="checkbox" .../>Opel</label>
</li>
<li>
<label><input type="checkbox" .../>Ford</label>
</li>
</ul>
</fieldset>
</li>
<li>
<fieldset>
<legend>Farbauswahl</legend>
<ul class="optionRange">
<li>
<label><input type="checkbox" .../>rot</label>
</li>
<li>
<label><input type="checkbox" .../>gruen</label>
</li>
<li>
<label><input type="checkbox" .../>blau</label>
</li>
</ul>
</fieldset>
</li>
<li>
<fieldset>
<legend>Kategoriename</legend>
<ul class="optionRange">
<li>
<label><input type="checkbox" .../>Option 1</label>
</li>
<li>
<label><input type="checkbox" .../>Option 2</label>
</li>
...
</ul>
</fieldset>
</li>
...
</ul>
...
</form>
dann noch mit css aufhuebschen. soll die darstellung kompakter
erfolgen (kategorien z.b. als navigationsreiter und immer nur
eine kategorie anzeigen), muss man zumindest beim msie 6 noch
mit etwas JavaScript nachhelfen - bei den anderen tut auch dort
reines css.
hat man es hingegen zusaetzlich bzw. ausschliesslich mit voneinander
abhaengigen daten zu tun, gilt es abzuwaegen zwischen datenmenge und
einer vernuenftigen visualisierung ebenjener daten und deren abhaengigkeiten.
wieviel JavaScript muss/darf (nicht) sein? soll es eine skriptlose
alternative im falle einer favorisierten JavaScript-lastigen loesung
geben?
waeren denn, wie in der beispielhaft gewaehlten abhaengigkeit
"Automarke/Modell", gruppierte auswahllisten eine loesung?:
<form ... >
...
<ul class="categoryRange">
<li><!-- class="category" //-->
<fieldset>
<legend>Automarke/Modell</legend>
<select name="model" size="12" multiple="multiple">
<optgroup label="Volkswagen">
<option label="Polo">Polo</option>
<option label="Golf">Golf</option>
<option label="Passat">Passat</option>
</optgroup>
<optgroup label="Opel">
<option label="Corsa">Corsa</option>
<option label="Astra">Astra</option>
<option label="Insignia">Insignia</option>
</optgroup>
<optgroup label="Ford">
<option label="Fiesta">Fiesta</option>
<option label="Focus">Focus</option>
<option label="Mondeo">Mondeo</option>
</optgroup>
</select>
</fieldset>
</li>
<li>
<fieldset>
<legend>Farbauswahl</legend>
<ul class="optionRange">
<li>
<label><input type="checkbox" .../>rot</label>
</li>
<li>
<label><input type="checkbox" .../>gruen</label>
</li>
<li>
<label><input type="checkbox" .../>blau</label>
</li>
</ul>
</fieldset>
</li>
...
</ul>
...
</form>
der einfache ansatz haelt den programmieraufwand auf der clientseite
so gering wie moeglich. alle getroffenen auswahlen sind vom scripting
unabhaengig, jederzeit nachvollziehbar und immer direkt zum absenden
bereit.
so long - peterS. - pseliger@gmx.net
»Because objects in JavaScript are so flexible, you will want to think differently about class hierarchies.
Deep hierarchies are inappropriate. Shallow hierarchies are efficient and expressive.« - Douglas Crockford
ie:( fl:) br:> va:( ls:& fo:) rl:) n3;} n4:} ss:} de:µ js:} mo:? zu:]