PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : [HTML/CSS/JS] onChange = Div Ein / Ausblenden ?



breaker
14.05.2008, 08:01
Moin :-)

Javascript ist wahrscheinlich den oberen 10000 vorbehalten, ich sitze schon 4 Tage an einem Problem ;)

Ich habe ein Formular, welches beim ändern eines Select je nach Status ein Bereich des Formulars ein oder ausblenden soll, ich habe aber keine Ahnung, wie ich sowas machen soll.


Bis jetzt habe ich das geschafft :




?>
<style type="text/css">
/* <![CDATA[ */
.SelectionBox {
width: 150px;
}
#myLayer {
width: 150px;
height: 150px;
border: 1px ridge #000000;
}
ul,li {
width: 150px;
list-style: none;
margin: 0px;
padding: 0px 0px 0px 0px;
}
/* ]]> */
</style>
<script type="text/javascript">
/* <![CDATA[ */

function SwapDisplay(auswahl) {
if(document.getElementById('myLayer').style.displa y == 'none') {
document.getElementById('myLayer').style.display = '';
} else {
document.getElementById('myLayer').style.display = 'none';
}
}
/* ]]> */
</script>

<?PHP

$out = '<div id="myLayer"><tr valign="top"><td>' . _WLFILEURL . ': </td><td><input type="text" name="url" value="' . $thisdata['url'] . '" size="60" maxlength="255">' . $upbutton . '&nbsp;' . $checkurl . '</td></tr></div>
<tr valign="top"><td>' . _WLCATEGORY . ': </td><td><select name="cid" onChange="SwapDisplay(this.value);">' . modGetCategoriesSelect(((isset($thisdata['cid'])) ? intval($thisdata['cid']) : 0), $showmaincat) . '</select></td></tr>';



Das Select schaltet auch, dummerweise nicht den Div, sondern nur ein Bereich wie oben im Style angegeben ist. Was mach ich da falsch ?

breaker
14.05.2008, 09:23
Ok, ich habs so halbwegst geschafft, ich hab den DIV jetzt gegen ein TBODY ausgetauscht, jetzt werden die Klamotten schonmal ausgeblendet :-)

Jetzt kommt das nächste Prob :)

Das Select hat den Namen "cid", wie kann ich den aktuellen Wert im JS abfragen ?

Benutzer1699
14.05.2008, 10:35
Moin,

benutz doch



style.visibility='hidden'
bzw.
style.visibility='visible';

breaker
15.05.2008, 10:29
Moin,

benutz doch



style.visibility='hidden'
bzw.
style.visibility='visible';


Hallo, ich habe es mal so versucht, wie du geschrieben hast, dummerweise ist der IE dann zu blöd, den Bereich auch wirklich als "nicht vorhanden" zu behandeln, spricht: Da wo die Tabelle war, welche Ausgeblendet wurde, ist ein fetter "Hohlraum" im Design......im FF dagegen funktionierte es wunderbar.

Ich habe es jetzt so gemacht ;)





<script type="text/javascript">

function SwapDisplay(auswahl) {
switch(auswahl) {
case "0":
document.getElementById("kat_auszahlung").style.display = 'none';
document.getElementById("kat_downline").style.display = 'none';
break;
case "1":
document.getElementById("kat_auszahlung").style.display = 'none';
document.getElementById("kat_downline").style.display = '';
break;
case "2":
document.getElementById("kat_auszahlung").style.display = 'none';
document.getElementById("kat_downline").style.display = '';
break;
case "3":
document.getElementById("kat_auszahlung").style.display = '';
document.getElementById("kat_downline").style.display = '';
break;
case "4":
document.getElementById("kat_auszahlung").style.display = 'none';
document.getElementById("kat_downline").style.display = '';
break;
case "5":
document.getElementById("kat_auszahlung").style.display = 'none';
document.getElementById("kat_downline").style.display = '';
break;
}
}
</script>


Läuft super und kann problemlos erweitert werden, eventuell schnall JS auch ein "default: ......." im Switch, muss ich noch testen ;)

Was ist allerdings nicht verstehe ist, das JS ein Integer als String behandelt.......wenn ich statt "case "1":" ein "case 1:" angebe, funktioniert es nichtmehr o_O

Benutzer1699
16.05.2008, 00:09
Willkommen in der Limitierung einzelner Interpretersprachen ;) PHP ist sehr großzügig, in C hingegen würde ein case '5': nicht funktionieren sondern nur case 5: :)
Aber super, dass du deine Lösung gepostet hast!

breaker
16.05.2008, 00:41
Willkommen in der Limitierung einzelner Interpretersprachen ;) PHP ist sehr großzügig, in C hingegen würde ein case '5': nicht funktionieren sondern nur case 5: :)
Aber super, dass du deine Lösung gepostet hast!



Ja, das mit dem Wert fand ich auch ziemlich seltsam, in PHP funktioniert es zwar auch, ist aber dann nicht so sauber, weil ein String eben kein Integer ist ;)

Ich habe die Case-Möglichkeit gewählt, weil ich mir denke, das es (ähnlich wie im PHP) etwas schneller ist, als unzählige IF-Anweisungen, falls jemand eine besser Lösung parat hat, lasse ich mich natürlich gerne belehren ;)

Benutzer1699
16.05.2008, 18:57
Man kann die Cases sortieren, dass das was im Schnitt am häufigsten benutzt wird nach ganz oben setzt :) Ansonsten schon ganz ok *g

Man könnte jetzt natürlich auch gleich den div-Namen als Parameter übergeben und etwas wie



function SwapDisplay(auswahl) {
document.getElementById(auswahl).style.display = 'none';
document.getElementById(auswahl).style.display = 'none';
}


machen.