PDA

View Full Version : [html/css] Selezionare un OPTGROUP da una lista

Nightingale
11-06-2007, 15:41
Salve a tutti,

ho l'impressione di star perdendo tempo per una cosa stupida. Pertanto avrei piacere nell'avere un vostro parere.
Ho la necessità di creare una lista di valori fra cui scegliere, nella quale esistono dei padri e dei filgi.

- Auto Tedesche
* opel
* bmw
- Auto Italiane
* Fiat
* Alfa Romeo

Cercando un po', avevo trovato l'opzione OPTGROUP che permette di raggruppare un insieme di opzioni. Il problema è che io vorrei fosse selezionabile anche il "gruppo principale", come Auto Tedesche.
Avete qualche consiglio? Grazie mille... Sto ravanando nel web, ma non riesco a trovare qualcosa di simile...
andbin
11-06-2007, 16:04
Cercando un po', avevo trovato l'opzione OPTGROUP che permette di raggruppare un insieme di opzioni. Il problema è che io vorrei fosse selezionabile anche il "gruppo principale", come Auto Tedesche.
Avete qualche consiglio? Grazie mille... Sto ravanando nel web, ma non riesco a trovare qualcosa di simile...Puoi usare solo <option> opportunamente stilizzati con CSS in modo tale da evidenziare la indentazione e i vari livelli.
Ecco un esempio che ho scritto per prova:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Prova</title>
<style type="text/css">
<!--
option.l1 { font-weight: bold; }
option.l2 { margin-left: 1.5em; }
-->
</style>
</head>
<body>

<select>
<option class="l1">Auto Tedesche</option>
<option class="l2">Opel</option>
<option class="l2">BMW</option>
<option class="l1">Auto Italiane</option>
<option class="l2">Fiat</option>
<option class="l2">Alfa Romeo</option>
</select>

</body>
</html>
Nightingale
11-06-2007, 16:23
Puoi usare solo <option> opportunamente stilizzati con CSS in modo tale da evidenziare la indentazione e i vari livelli.
Ecco un esempio che ho scritto per prova:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Prova</title>
<style type="text/css">
<!--
option.l1 { font-weight: bold; }
option.l2 { margin-left: 1.5em; }
-->
</style>
</head>
<body>

<select>
<option class="l1">Auto Tedesche</option>
<option class="l2">Opel</option>
<option class="l2">BMW</option>
<option class="l1">Auto Italiane</option>
<option class="l2">Fiat</option>
<option class="l2">Alfa Romeo</option>
</select>

</body>
</html>

Ok... Grazie mille per la dritta. Credo proprio che farò così! :)
andbin
11-06-2007, 16:32
azz .... i soliti problemi di compatibilità: come ho fatto la stilizzazione funziona solo con Firefox/Netscape. Non con IE/Opera.
Se vuoi che i sotto-elementi siano indentati mi sa che è meglio se metti dei bei &nbsp; :D
Nightingale
11-06-2007, 16:33
Ed infatti l'ho appena fatto. Perfetto! Grazie ancora...

Potrei perfezionare solo una cosa... io posso avere più livelli. In teoria infiniti, ma all'atto pratico so che nell'applicativo non andremo oltre i 4-5.
Come ho fatto ora, mi indenta fino al livello 5, il massimo che ho previsto, e mi scrive in bold quello principale, il primo livello. In realtà vorrei provare a colorare in bold tutti i livelli che hanno un figlio.
Nightingale
11-06-2007, 16:37
azz .... i soliti problemi di compatibilità: come ho fatto la stilizzazione funziona solo con Firefox/Netscape. Non con IE/Opera.
Se vuoi che i sotto-elementi siano indentati mi sa che è meglio se metti dei bei &nbsp; :D

Vero... ho appena provato in IE e non va... :p
Come faccio però a mettere N &nbsp; per livello?
andbin
11-06-2007, 16:48
In realtà vorrei provare a colorare in bold tutti i livelli che hanno un figlio.Non sembra così facile .... lo stile "bold" funziona solo con Firefox. Lo stile "background" invece funziona con Firefox e IE. :mad:

Come faccio però a mettere N &nbsp; per livello?Ne metti 3 o 4 in sequenza.