Script per modificare valore select

[idnob]

Ciao ragazzi, ho una pagina semplicissima in cui è presente una form con:
- select che è il nome dei materiali in magazzino a cui ho dato il nome ""
- input type text relativo alla misura che dovrà essere modificato dalla selezione di un materiale nella select precedente
- input type number che è la quantità del materiale selezionato

Funzionamento desiderato è il seguente:
- seleziono un tipo di materiale dalla prima select
- voglio che a seconda del materiale selezionato il valore all'interno della casella relativa alla misura cambi, per esempio se seleziono il legno può essere solo 1mmx1mm invece se prendo il ferro può essere solo 2mmx2mm.

Il mio ragionamento per creare lo script è stato:
- prendo tutti i materiali e li metto in un CASE e assegno la misura da caso a caso.
Codice Pagina

<form action='upload.php' method='POST'>        
<h1>Nome:</h1></b><select name="nome" id="nomemateriale" ><br>
                           <option value="Forex 1 mm" selected>Forex 1 mm</option>
                <option value="Forex 2 mm">Forex 2 mm</option>
                           <option value="Forex 3 mm">Forex 3 mm</option>
                           <option value="Forex 4 mm">Forex 4 mm</option>
                           <option value="Forex 5 mm">Forex 5 mm</option>
                           <option value="Forex 10 mm">Forex 10 mm</option>
                           <option value="Forex Nero 3 mm">Forex Nero 3 mm</option>
                           <option value="Forex Nero 5 mm">Forex Nero 5 mm</option>
                           <option value="Forex Nero 10 mm">Forex Nero 10 mm</option>
                           <option value="Pvc Light 10 mm">Pvc Light 10 mm</option>
                           <option value="Pvc Light 15 mm">Pvc Light 15 mm</option>
                           <option value="Pvc Light 19 mm">Pvc Light 19 mm</option>
                           <option value="Pvc Light 30 mm">Pvc Light 30 mm</option>
</select>
                           
        <h1>Dimensione:</h1><input type="text" name="dimensione" id="dimesionemateriale" ><br>
        <h1>Quantita:</h1><input type="number" name="quantita"  ><br>
        <h1>Azione:</h1><input type="text" name="azione" id="action">
        <input type="submit" value="Inserisci" ></td>
    </form>

​

Codice script

<script type="text/javascript">function setDimensione(){
switch (document.getElementById("nomemateriale").value)
{
  case 'Forex 1 mm': document.getElementById("dimensionemateriale").value="200 x 300";
            break;
  case 'Forex 2 mm': document.getElementById("dimensionemateriale").value="200 x 300";
            break;
  case 'Forex 3 mm': document.getElementById("dimensionemateriale").value="200 x 300";
            break;
  case 'Forex 5 mm': document.getElementById("dimensionemateriale").value="200 x 300";
            break;
  case 'Forex 10 mm': document.getElementById("dimensionemateriale").value="200 x 300";
            break;
  case 'Forex Nero 3 mm': document.getElementById("dimensionemateriale").value="200 x 300";
            break;
  case 'Forex Nero 5 mm': document.getElementById("dimensionemateriale").value="200 x 300";
  
            break;
  case 'Forex Nero 10 mm': document.getElementById("dimensionemateriale").value="200 x 300";
  
            break;
  case 'Pvc Light 10 mm': document.getElementById("dimensionemateriale").value="200 x 300";
  
            break;
  case 'Pvc Light 15 mm': document.getElementById("dimensionemateriale").value="200 x 300";
  
            break;
  case 'Pvc Light 19 mm': document.getElementById("dimensionemateriale").value="200 x 300";
  
            break;
  case 'Pvc Light 30 mm': document.getElementById("dimensionemateriale").value="200 x 300";
  
            break;
}
}
            
            
</script>

Dove devo mettere onclick()? su ogni option della select?

Grazie mille in anticipo!

[Vindav]

devi gestire l'onchange sul tag select

[idnob]

devi gestire l'onchange sul tag select

non funziona accidenti...qualcosa di sbagliato nel codice? non vedo nulla di errato...

[Vindav]

posta il codice modificato con l'onchange

[idnob]

Script: (ho provato ad usare myform nei primi 2 case e getElementById negli altri)

<script type="text/javascript">function setDimensione(){ 
switch (document.getElementById("nomemateriale").value)
{
  case 'Forex 1 mm': document.myform.dimensione.value="200 x 300";
            break;
  case 'Forex 2 mm': document.myform.dimensione.value="200 x 300";
            break;
  case 'Forex 3 mm': document.getElementById("dimensionemateriale").value="200 x 300";
            break;
  case 'Forex 5 mm': document.getElementById("dimensionemateriale").value="200 x 300";
            break;
  case 'Forex 10 mm': document.getElementById("dimensionemateriale").value="200 x 300";
            break;
  case 'Forex Nero 3 mm': document.getElementById("dimensionemateriale").value="200 x 300";
            break;
  case 'Forex Nero 5 mm': document.getElementById("dimensionemateriale").value="200 x 300";
  
            break;
  case 'Forex Nero 10 mm': document.getElementById("dimensionemateriale").value="200 x 300";
  
            break;
  case 'Pvc Light 10 mm': document.getElementById("dimensionemateriale").value="200 x 300";
  
            break;
  case 'Pvc Light 15 mm': document.getElementById("dimensionemateriale").value="200 x 300";
  
            break;
  case 'Pvc Light 19 mm': document.getElementById("dimensionemateriale").value="200 x 300";
  
            break;
  case 'Pvc Light 30 mm': document.getElementById("dimensionemateriale").value="200 x 300";
  
            break;
}
}

Codice Pagina

<form action='upload.php' method='POST' name="form">        <h1>Nome:</h1></b><select name="nome" id="nomemateriale" ><br>
        <option value="Forex 1 mm" selected onchange="setDimensione()"">Forex 1 mm</option>
        <option value="Forex 2 mm" onchange="setDimensione()">Forex 2 mm</option>

Ho messo solo i primi due della lista.

[Vindav]

Leggi bene quello che ho scritto:

devi gestire l'onchange sul tag select

l'onchange va gestito nel tag select, non nelle option

[idnob]

niente da fare purtroppo, eppure la logica è giusta...
grazie intanto per lo sbattimento...

[Vindav]

quindi? posta nuovamente il codice modificato, cosi ci do un occhiata

[idnob]

alla fine funziona sbagliavo solamente a mettere il nome, ecco il codice aggiornato:
per la select

<select name="nome" id="nomemateriale" onchange="settipo()"><br>

Per la funzione:

function settipo(){ var value = document.getElementById("nomemateriale").value;
switch (value)
{
  case 'Forex 1 mm': document.form.tipo.value="200 x 300";
            break;

Form era sbagliato, gli avevo dato un altro nome.
Adesso tutto perfetto.