Classi Div hide and seek

[gorn]

Salve a tutti,

oggi ho un problema con la gestione delle classi su alcuni DIV.

Mi spiego meglio: io ho una lista di domande che vengono mostrate in una pagina e associate a queste domande possono esserci una o piu risposte.
Quello che io voglio fare è mostrare le risposte alle domande solo se viene premuto il bottone con value="Mostra" e modificare tale bottone dandogli value="Nascondi" per nascondere le risposte al successivo click.

Tutto mi sembrava molto semplice (faccio una semplice funzioncina in javascript ) ma non avevo fatto i conti con i selettori degli elementi DOM

Di seguito il codice che ho creato fino ad ora:

Codice javascript

<script language="JavaScript">

function mostranascondirisposte() {
var mioArray=document.getElementsByTagName("div");
var lun=mioArray.length;  
for (n=0;n<lun;n++) { 
	if (mioArray[n].className=="ticketrispostenascondi") {
		mioArray[n].setAttribute("class","ticketrispostemostra");
		document.getElementById("scelta").setAttribute("value","Nascondi");
	}
	if (mioArray[n].className=="ticketrispostemostra") {
		mioArray[n].setAttribute("class","ticketrispostenascondi");
		document.getElementById("scelta").setAttribute("value","Mostra");
	}	
}
}
</script>

Codice html + php per la creazione del bottone e delle DIV contenenti le risposte

<input type="button" id="scelta" value="Mostra" onClick="mostranascondirisposte();"/>

<div id="mostranascondi" class="ticketrispostenascondi">      
<?php $_repl = $tpl_vars['ticket']['replies']; if (!is_array($_repl) && !is_object($_repl)) { settype($_repl, 'array'); }if (count($_repl)):
    foreach ($_repl as $tpl_vars['risposte']):
        echo "<div class=\"ticket\">";
        echo "<div class=\"ticket-header\" style=\"background-color:".$tpl_vars['ticket' ['coloreImpianto']."\">"; 
        echo "Risposta ticket ";
        echo $tpl_vars['ticket']['id'];
        echo "</div>";
        echo "<div class=\"ticket-problema\">";
        echo $tpl_vars['risposte']['risposta'];
        echo "<br class=\"clearfloat\" />
</div>";
        echo "<div class=\"ticket-footer\">"; 
        echo "Data risposta: ";
        echo DataOra($tpl_vars['risposte']['data']);
        echo "<br class=\"clearfloat\" /></div>";
        echo "</div>";
    
    endforeach; echo "


"; endif; unset($_repl);    ?>
</div>

Di seguito le classi che dovrebbero essere sostituite alla pressione del bottone

.ticketrispostemostra {
	display: block;
}

.ticketrispostenascondi {
	display: none;
}

Sono sicurissssssimo che sarà una banalità ma io sinceramente non riesco a trovarla

Spero, come al solito, in un vostro aiuto

[Emulman]

potresti usare jquery che risolve il tutto in maniera semplcie ed elegante...ad esempio

<script>
   $(document).ready(function() {
      var scelta = $('#scelta').toggle(showOrHide);
      if (scelta == true)
         $(".ticketrispostenascondi").css("display", "block");
      else
         $(".ticketrispostenascondi").css("display", "none");
   });
</script> 

.toggle(showOrHide); è un "interruttore", nel senso che se un valore è vero allora fai qualcosa altrimenti fai qualcosa di altro..

[gorn]

Eh... usare JQuery mi semplificherebbe la vita ma in questo progetto non posso inglobare librerie esterne

La soluzione devo trovarla utilizzando solo Javascript pure (niente jquery o affini)

help

[Vindav]

if (mioArray[n].className=="ticketrispostenascondi") {
		mioArray[n].setAttribute("class","ticketrispostemostra");
		document.getElementById("scelta").setAttribute("value","Nascondi");
	}
	else if(mioArray[n].className=="ticketrispostemostra") {
		mioArray[n].setAttribute("class","ticketrispostenascondi");
		document.getElementById("scelta").setAttribute("value","Mostra");
	}

[gorn]

Ecco, questa proprio non me la spiego..

Ho seguito il suggerimento di Vindav e ho sostituito i 2 if con un if-elseif ed ora tutto funziona perfettamente...

Mi sono perso qualche regola di utilizzo degli if? perchè non posso usare 2 if di seguito? Dovrebbe essere uguale... oppure (evidentemente) no?



Comunque ora funziona

Grazie a tutti,