mostrare un <tr> solo se un'opzione della select è settata

[allin81]

Buongiorno
Sto avendo dei piccoli problemi a mostrare un tr solo se la select che mi interessa ha come opzione un valore diverso da 1.

In pratica:
se viene scelta l'opzione 1 deve nascondere il tr
se viene scelta qualsiasi altra opzione deve mostrare il tr

Riesco a fare questo, il problema è che poi mi sballa le dimensioni delle tue celle interne, mette tutto il contenuto nella prima cella e non sono allineati con gli altri
Posto un esempio inserendo uno sfondo giallo per far capire dove sta il problema

Qui è quando non devo mostrare i <tr> in questione



Qui invece è dove mostro i <tr> e non incolonna tutto come si deve


come javascript sto usando questo:

function nascondiMostra (bShow) {
var riga = document.getElementsByClassName("nascosto")
for(var i=0; i<riga.length; i++){
if(bShow==1){
riga[i].style.display="none";
}else{
riga[i].style.display="block";
}
}
}
window.onload = function () {
nascondiMostra(document.inserimento_offerte.tour_operator.options[inserimento_offerte.tour_operator.selectedIndex].value);
};

Alla select invece ho dato questo:

onchange="nascondiMostra(this.options[this.selectedIndex].value);

ed ai tr ho dato la classe "nascosto"

Come mai mi accade questo?

In pratica questo è tutto l'html che mi crea i 4 tr

<tr class="nascosto" style="background: #ffff00;">
        <td><p class="nascosto">Prezzo Pacchetto &euro; (a persona)</p></td>
        <td><input type="text" class="form-control nascosto" id="prezzo_fisso_in_doppia" name="prezzo_fisso_in_doppia" value="<?=$prezzo_fisso_in_doppia?>"></td>
    </tr>
    <tr class="nascosto" style="background: #ffff00;">
        <td><p class="nascosto">Prezzo Pacchetto in tripla &euro; (costo terza persona)</p></td>
        <td><input type="text" class="form-control nascosto" id="prezzo_fisso_in_tripla" name="prezzo_fisso_in_tripla" value="<?=$prezzo_fisso_in_tripla?>"></td>
    </tr>
    <tr class="nascosto" style="background: #ffff00;">
        <td><p class="nascosto">Prezzo Fisso 3° letto bambino &euro; (a persona)</p></td>
        <td><input type="text" class="form-control nascosto" id="prezzo_fisso_primo_bambino" name="prezzo_fisso_primo_bambino" value="<?=$prezzo_fisso_primo_bambino?>"></td>
    </tr>
    <tr class="nascosto" style="background: #ffff00;">
        <td><p class="nascosto">Prezzo Fisso 4° letto bambino &euro; (a persona)</p></td>
        <td><input type="text" class="form-control nascosto" id="prezzo_fisso_secondo_bambino" name="prezzo_fisso_secondo_bambino" value="<?=$prezzo_fisso_secondo_bambino?>"></td>
    </tr>

[ciro78]

Ciao,
se le visualizzi a prescindere dalla casella di testo le vedi sballate lo stesso?

[allin81]

Ciao,
se le visualizzi a prescindere dalla casella di testo le vedi sballate lo stesso?

No, se visualizza senza controllare le vedo bene, per questo non capisco il problema

[Vincent.Zeno]

ricordo di aver avuto un problema simile.
se ricordo bene l'elemento nascosto non eredita le dimensioni naturali, vanno quindi specificate.

prova

[ninja72]

Prova a sostituire nella funzione nascondiMostra il riga[i].style.display = "block" con riga[i].style.display = "table-row".

[allin81]

Prova a sostituire nella funzione nascondiMostra il riga[i].style.display = "block" con riga[i].style.display = "table-row".

spettacolo, funziona alla grandissima, grazie

[allin81]

ricordo di aver avuto un problema simile.
se ricordo bene l'elemento nascosto non eredita le dimensioni naturali, vanno quindi specificate.

prova

avevo provato anche questa soluzione ma non andava.
La soluzione si ninja72 ha risolto il problema

[allin81]

Un ultimo dettaglio:
Nella select che ho per fare questo controllo, al momento ho 3 valori

Seleziona (con id 0)
Valore 1 (con id 1)
Valore 2 (con id 2)

La cosa funziona correttamente quando è settato un id diverso da 1 (quindi 2,3,4,5 ecc)
Ma non funziona quando l'id è 0 (Seleziona)

Come potrei farlo funzionare anche quando si apre la pagina e la select è ancora settata su "seleziona"?
Grazie

[allin81]

credo di aver risolto cosi:

if((bShow==0)||(bShow==1)){

[ninja72]

Non è molto chiaro, in pratica vorresti all'apertura della pagina l'index 0 della select produca lo stesso effetto dell'index 1 nascondendo le TR della table ?
Un'altro consiglio che posso darti è quello di eliminare le classi superflue "nascosto" sui paragrafi e gli input, (basta solo sui tag TR).