Teil von SELFHTML Forum Teil von SELFHTML Forumsarchiv Teil von 2005 Teil von August

SELFHTML Forumsarchiv
Tabellenspalte ausblenden
Informationsseite
  1. Seite (JAVASCRIPT) Tabellenspalte ausblenden von Marc Wagener, 30. 08. 2005, 16:49
nach unten

Tabellenspalte ausblenden

Die folgende Nachricht zum Thema stammt von: Marc Wagener, 30. 08. 2005, 16:49

Hallo,
ich habe eine Tabelle mit zwei Spalten.
Beim Aufruf der Seite soll nur Splate A angezeigt werden.
Mit einem Klick auf einen Button soll z.B. Spalte A ausgebelendet werden und nur Spalte B angezeigt werden.
bei erneutem Klick auf den Button, soll wieder nur Spalte A angezeigt werden.

Kann jemand helfen ? Ich habe mich bereits durch einige JavaScripts
"gewühlt" aber noch nichts passendes gefunden.

Danke
Marc

nach obennach unten

Tabellenspalte ausblenden

Die folgende Nachricht zum Thema stammt von: lina-, 30. 08. 2005, 17:06

moin Marc Wagener :)

ich glaube dir helfen folgende Seiten:
CSS-Eigenschaft visibility, javascript style und Eventhandling mit Javascript

(wenn der Button geklickt wurde abfragen welchen visibility-Status die jeweiligen Spalten haben und auf den entgegengesetzten Wert - visible oder hidden - setzen)

Das ganze ist natürlich nicht möglich, wenn der User Javascript ausgeschaltet hat - das solltest du unbedingt im Kopf haben, wenn du sowas umsetzen willst.
liebe Grüße aus Berlin
lina-
--
Self-Code: ie:% fl:( br:^ va:) ls:/ fo:| rl:( ss:) de:] js:| mo:)

nach obennach unten

Tabellenspalte ausblenden

Die folgende Nachricht zum Thema stammt von: jan Guth, 30. 08. 2005, 17:19

<script type="text/javascript">
<!--
    function display(spalte)
    {
        document.getElementById(spalte).style.display = "none";
    }
-->
</script>
<table>
<tr>
    <td id="spalte1">spalte1</td>
    <td id="spalte2">spalte2</td>
</tr>
</table>
<a href="javascript:display('spalte1');">spalte1</a>
<a href="javascript:display('spalte2');">spalte2</a>

nach obennach unten

Tabellenspalte ausblenden

Die folgende Nachricht zum Thema stammt von: Hans, 30. 08. 2005, 17:11

Hallo Marc,

<HTML>
<BODY>
<TABLE>
<TR>
<TD ID="eins">
<TABLE BORDER=1>
<TR>
<TD>links</TD>
</TR>
</TABLE>
</TD>
<TD ID="zwei">
<TABLE BORDER=1>
<TR>
<TD>rechts</TD>
</TR>
</TABLE>
</TD>
</TR>
</TABLE>
<FORM>
<INPUT TYPE=BUTTON NAME="mach" VALUE="Klick" onClick="my_funktion()"></BUTTON>
</FORM>
<SCRIPT>
document.getElementById("zwei").style.visibility="hidden";
var status=0;
function my_funktion() {
   if (status==0) {
      document.getElementById("eins").style.visibility="hidden";
      document.getElementById("zwei").style.visibility="visible";
      status=1;
   }
   else {
      document.getElementById("eins").style.visibility="visible";
      document.getElementById("zwei").style.visibility="hidden";
      status=0;
   }
}
</SCRIPT>
</BODY>
</HTML>

Also, statt einer Tabelle, werden zwei Tabellen gemacht, die je aus einer Spalte bestehen. Diese beiden Spalten werden zu einer Tabelle wieder zusammengebaut.
Die zweite Spalte mit der ID eins wird zuerst unsichtbar gemacht. Sobald man den Knopf drückt, wird die sichtbare unsichtbar und die unsichtbare wieder sichtbar. Bei IE6.0 funktioniert es.

Gruß

Hans
      

nach obennach unten

Tabellenspalte ausblenden

Die folgende Nachricht zum Thema stammt von: Marc Wagener, 30. 08. 2005, 19:20

Hallo Hans,
super; vielen Dank. Ist es auch noch möglich, dass die rechte Spalte dann an der gleichen Stelle wie die linke Spalte angezeigt wid?

Danke
Marc


»» Hallo Marc,
»»
»» <HTML>
»» <BODY>
»» <TABLE>
»» <TR>
»» <TD ID="eins">
»» <TABLE BORDER=1>
»» <TR>
»» <TD>links</TD>
»» </TR>
»» </TABLE>
»» </TD>
»» <TD ID="zwei">
»» <TABLE BORDER=1>
»» <TR>
»» <TD>rechts</TD>
»» </TR>
»» </TABLE>
»» </TD>
»» </TR>
»» </TABLE>
»» <FORM>
»» <INPUT TYPE=BUTTON NAME="mach" VALUE="Klick" onClick="my_funktion()"></BUTTON>
»» </FORM>
»» <SCRIPT>
»» document.getElementById("zwei").style.visibility="hidden";
»» var status=0;
»» function my_funktion() {
»»    if (status==0) {
»»       document.getElementById("eins").style.visibility="hidden";
»»       document.getElementById("zwei").style.visibility="visible";
»»       status=1;
»»    }
»»    else {
»»       document.getElementById("eins").style.visibility="visible";
»»       document.getElementById("zwei").style.visibility="hidden";
»»       status=0;
»»    }
»» }
»» </SCRIPT>
»» </BODY>
»» </HTML>
»»
»» Also, statt einer Tabelle, werden zwei Tabellen gemacht, die je aus einer Spalte bestehen. Diese beiden Spalten werden zu einer Tabelle wieder zusammengebaut.
»» Die zweite Spalte mit der ID eins wird zuerst unsichtbar gemacht. Sobald man den Knopf drückt, wird die sichtbare unsichtbar und die unsichtbare wieder sichtbar. Bei IE6.0 funktioniert es.
»»
»» Gruß
»»
»» Hans
»»       

nach obennach unten

Tabellenspalte ausblenden

Die folgende Nachricht zum Thema stammt von: Hans, 31. 08. 2005, 11:46

Hallo Marc,

hm, vielleicht. Müßte man mal mit den Style-dingern rumprobieren. Vielleicht mit innerHTML oder so

Gruß

Hans
»» Hallo Hans,
»» super; vielen Dank. Ist es auch noch möglich, dass die rechte Spalte dann an der gleichen Stelle wie die linke Spalte angezeigt wid?
»»
»» Danke
»» Marc
»»

nach obennach unten

Tabellenspalte ausblenden

Die folgende Nachricht zum Thema stammt von: Marc Wagener, 31. 08. 2005, 13:29

Hallo,
ich habe die Lösung gefunden - danke an alle:

<script language="JavaScript">
document.getElementById("1").style.visibility ="hidden";
var status=0;
function curr() {
   if (status==0) {
      document.getElementById("1").style.visibility ="visible";
      document.getElementById("2").style.display = "none";
      status=1;
   }
   else {
      document.getElementById("2").style.display ="inline";
      document.getElementById("1").style.visibility = "hidden";
      status=0;
   }
}
</script>

Gruss
Marc




»» Hallo Marc,
»»
»» hm, vielleicht. Müßte man mal mit den Style-dingern rumprobieren. Vielleicht mit innerHTML oder so
»»
»» Gruß
»»
»» Hans
»» »» Hallo Hans,
»» »» super; vielen Dank. Ist es auch noch möglich, dass die rechte Spalte dann an der gleichen Stelle wie die linke Spalte angezeigt wid?
»» »»
»» »» Danke
»» »» Marc
»» »»

nach obennach unten

Tabellenteile ausblenden - die Vierte

Die folgende Nachricht zum Thema stammt von: Gernot Back, 31. 08. 2005, 15:23

Hallo Marc,

»» <script language="JavaScript">
»» document.getElementById("1").style.visibility ="hidden";
»» var status=0;
»» function curr() {
»»    if (status==0) {
»»       document.getElementById("1").style.visibility ="visible";
»»       document.getElementById("2").style.display = "none";
»»       status=1;
»»    }
»»    else {
»»       document.getElementById("2").style.display ="inline";
»»       document.getElementById("1").style.visibility = "hidden";
»»       status=0;
»»    }
»» }
»» </script>

Ich versteh jetzt noch nicht ganz, was die Display-Eigenschaft "inline" mit einer Tabellenspalte oder den darin enthaltenen Zellen zu tun hat. Vielleicht habe ich ja auch gar nicht verstanden, was du eigentlich wolltest.

Jedenfalls habe ich mal zu meiner bekannten Seite, auf der man Tabellenzeilen wegblenden kann:

http://www.sprachlernspiele.de/selftests/klapptabelle/version7_1.html

auch mal eine Version gebaut, wo das mit den Tabellenspalten geschieht:

http://www.sprachlernspiele.de/selftests/klapptabelle/spaltenfilter.html

Die unterschiedliche Art, wie die einzelnen Browser dabei die Borders darstellen; insbesondere das "Borderline-Syndrom" von Opera, machen mir dabei aber durchaus noch Kummer.

Gruß Gernot

nach obennach unten

Tabellenteile ausblenden - die Vierte

Die folgende Nachricht zum Thema stammt von: Marc.Wagener, 31. 08. 2005, 16:50

Hallo Gernot,

danke für Deine Antwort.
ich habe das mit dem inline ausprobiert, damit ich die Spalte einfach wieder eingeblendet wird - auch wenn's nichtganz logisch ist - es funktioniert auf jeden Fall :-)).

Danke auch für Dein Beispiel.

Ich wollte eigentlich nur eine Tabelle mit zwei Spalten, in der z.B. durch einen Button wahlweise Spalte A oder Spalte B eingeblendet wird. Bei Aufruf der Seite sollte nur Spalte A eingeblendet sein und beim klich auf denButto nnur Spalte B (an gleicher Stelle).

Gruss
Marc



»» Hallo Marc,
»»
»» »» <script language="JavaScript">
»» »» document.getElementById("1").style.visibility ="hidden";
»» »» var status=0;
»» »» function curr() {
»» »»    if (status==0) {
»» »»       document.getElementById("1").style.visibility ="visible";
»» »»       document.getElementById("2").style.display = "none";
»» »»       status=1;
»» »»    }
»» »»    else {
»» »»       document.getElementById("2").style.display ="inline";
»» »»       document.getElementById("1").style.visibility = "hidden";
»» »»       status=0;
»» »»    }
»» »» }
»» »» </script>
»»
»» Ich versteh jetzt noch nicht ganz, was die Display-Eigenschaft "inline" mit einer Tabellenspalte oder den darin enthaltenen Zellen zu tun hat. Vielleicht habe ich ja auch gar nicht verstanden, was du eigentlich wolltest.
»»
»» Jedenfalls habe ich mal zu meiner bekannten Seite, auf der man Tabellenzeilen wegblenden kann:
»»
»» http://www.sprachlernspiele.de/selftests/klapptabelle/version7_1.html
»»
»» auch mal eine Version gebaut, wo das mit den Tabellenspalten geschieht:
»»
»» http://www.sprachlernspiele.de/selftests/klapptabelle/spaltenfilter.html
»»
»» Die unterschiedliche Art, wie die einzelnen Browser dabei die Borders darstellen; insbesondere das "Borderline-Syndrom" von Opera, machen mir dabei aber durchaus noch Kummer.
»»
»» Gruß Gernot

nach obennach unten

Tabellenteile ausblenden - die Vierte

Die folgende Nachricht zum Thema stammt von: Cybaer, 01. 09. 2005, 08:45

Hi,

»» ich habe das mit dem inline ausprobiert, damit ich die Spalte einfach wieder eingeblendet wird - auch wenn's nichtganz logisch ist - es funktioniert auf jeden Fall :-)).

Wohl nur in Browsern, die sich nicht an Standards halten (also IE).

Nimm statt "inline" lieber "".


Eine fertige Funktion: Coding: Darstellungswechsel - Un-/Sichtbare Elemente: Ein-/Ausklappen, Verstecken, Transparenz, Farbe. Ein Beispiel zum Einfärben von Spalten ist dabei. Einfach den Parameter "back" (nebst Farbwert) durch "fold" ersetzen sollte funktionieren.


Gruß, Cybaer

--
Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!

nach obennach unten

Tabellenteile ausblenden - die Vierte

Die folgende Nachricht zum Thema stammt von: Gernot Back, 01. 09. 2005, 11:16

Hallo nochmal,

http://www.sprachlernspiele.de/selftests/klapptabelle/spaltenfilter.html

»» Die unterschiedliche Art, wie die einzelnen Browser dabei die Borders darstellen; insbesondere das "Borderline-Syndrom" von Opera, machen mir dabei aber durchaus noch Kummer.

Ich habe mittlerweile eine therapierte Version hochgeladen.

Opera und Mozilla/Firefox waren wohl an gewissen (jeweils anderen) Stellen bei dynamischen Border-Änderungen mit dem Border-Collapse überfordert.

Gruß Gernot

nach obennach unten

Borderline-Syndrom bei Netscape 7.1

Die folgende Nachricht zum Thema stammt von: Gernot Back, 01. 09. 2005, 21:20

Hallo nochmal,

http://www.sprachlernspiele.de/selftests/klapptabelle/spaltenfilter.html

»» »» Die unterschiedliche Art, wie die einzelnen Browser dabei die Borders darstellen; insbesondere das "Borderline-Syndrom" von Opera, machen mir dabei aber durchaus noch Kummer.

»» Ich habe mittlerweile eine therapierte Version hochgeladen.

Wie ich dem Borderline-Syndrom bei Netscape 7.1 (getestet unter Windows 98) begegnen soll (obere Tabellenlinie bleibt beim Zusammenklappen auf Originalbreite) weiß ich immer noch nicht.

Hat jemand eine Idee?

Gruß Gernot

nach oben
Teil von SELFHTML Forum Teil von SELFHTML Forumsarchiv Teil von 2005 Teil von August

© 1998-2006 Seite Impressum, Software: Classic Forum