Tanja Schmitt: Bereiche einer Tabelle ein- und ausblenden

Hallo,

ich möchte gerne in einer Eingabemaske, abhängig davon, ob jemand in einem Feld etwas einträgt oder eine Checkbox aktiviert, bestimme Eingabefelder hinzufügen bzw. wieder entfernen.

z.B. Klickt einer <<Haustiere?>> an, dann soll auch nur dann Felder zu sehen sein, die den Namen und Art des Haustieres abfragen.

In einem einfachen Test hatte ich das über DIV-Bereiche gelöst, die als Style display:none hatten und je nach Inhalt auf display:inline geändert wurden. Das hat sehr gut funktioniert.

Wenn ich nun aber das Ganze in meinem tabellen-formatierten Formular integrieren will, zerschiesst mir das Script immer die Optik.
Ich hab's zunächst probiert, indem ich nur dem TR-Tag den Style mitgab, ber auch schon allen innerhalb des TR-Tags enthaltenen Elemente.
Immer zerschiesst mir das sichtbar und nichtsichtbar schalten mein Layout.

Vielleicht noch zur Info, ich teste/entwickle zur Zeit mit der Mozilla-Engine (Firefox).

Wie löse ich das denn am Besten? Ich muss doch nicht mein ganzes Table-Layout über den haufen werfen und neumachen, oder?

Vielen Dank für Eure Hilfe,

Tanja

  1. Hallo,

    Hallo,

    Ohne Deine Seite zu kennen, würd ich mal ins Blaue hinein <div>s in den Tabellenzellen unterzubringen, und diese ein und auszublenden.
    Wenn du <td>'s bzw. <tr>s an bzw. ausschaltest, ist klar, dass die
    Tabelle zerschossen wird, aber bei innenliegenden divs muesste die Tabellenstruktur erhalten bleiben, selbst wenn du die divs unsichtbar machst.

    Wie löse ich das denn am Besten? Ich muss doch nicht mein ganzes Table-Layout über den haufen werfen und neumachen, oder?

    Wenn du mehrere solche Sachen machen willst, würde ich mir in der Tat überlegen, ob du mit CSS-positionierten divs nicht besser fährst. Umarrangieren von Inhalten, ein- und Ausblenden, das geht damit einfach dynamischer und der Code wird übersichtlicher - ist aber natürlich Geschmackssache und eine Frage des Aufwands :)

    Gruesse,
    Joerg

    Vielen Dank für Eure Hilfe,

    Tanja

  2. Hi,

    probiere das Umschalten doch mal über visibility anstatt display, dann sollte der Platz weiterhin reserviert bleiben.

    freundliche Grüße
    Ingo

    1. Hallo Ingo,

      probiere das Umschalten doch mal über visibility anstatt display, dann sollte der Platz weiterhin reserviert bleiben.

      Das hatte ich zunächst auch machen wollen, aber das sieht nicht so toll aus, wenn da 'zig' Leerzeilen zu sehen sind.
      Wäre echt schon schön, wenn es über das display gehen könnte.

      Gruß,

      Tanja

      1. Hi,

        Das hatte ich zunächst auch machen wollen, aber das sieht nicht so toll aus, wenn da 'zig' Leerzeilen zu sehen sind.
        Wäre echt schon schön, wenn es über das display gehen könnte.

        also Du möchtest den Platz nicht reserviert haben aber die Tabellenstruktur beibehalten? Wenn Du ein DIV in der Zelle über display:none ausblendest, sollte dies zu erreichen sein und die ganze Tabelle neu gerendert werden.
        Oder Du ersetzt die Tabelle durch andere Elemente, die Du über float und margin entsprechend ausrichtest.

        freundliche Grüße
        Ingo

  3. Hi,

    Wenn ich nun aber das Ganze in meinem tabellen-formatierten Formular integrieren will, zerschiesst mir das Script immer die Optik.

    Wieso? Zeile an/aus, Spalte an/aus. Bei einzelnen Zellen könnte es vielleicht Probleme geben. Da wäre visibility wohl besser  (die Tabellenstruktur soll ja wohl erhalten bleiben - wozu sonst eine Tabelle?).

    Immer zerschiesst mir das sichtbar und nichtsichtbar schalten mein Layout.

    Also bei mir nicht (s. http://Coding.vampirehost.de/Toggle: Zeilen & Spalten). Beachte aber auch die Ausführungen zu den Browser-spezifischen Werten für display!

    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"!