Ankündigung

Einklappen
Keine Ankündigung bisher.

[Erledigt] Tabellenzeilen ausblenden/einfügen

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • [Erledigt] Tabellenzeilen ausblenden/einfügen

    Hallo zusammen,

    habe da folgendes Problem...

    Und zwar habe ich eine Tabelle erstellt in der Eingabefelder angezeigt werden. Es sind 4 Eingabebereiche mit jeweils 3 Eingabefelder. Jetzt soll man in einem Listenfeld auswählen wieviel Eingabebereiche angezeigt werden sollen.

    Code:
    <form action="formular_wizzard.php" name="formular" method="post">
    
    <table cellpadding="2" cellspacing="0" width="50%" style="position:absolute; left: 200px; top: 50px;">
    <tr>
    <td class="editTableL">Formulartyp:</td>
    <td class="editTableR">
    <select class="inputText" name="formulartyp" size="1">
    
    <option>1 Knopf/ 1 Feld</option>
    <option>2 Kn&ouml;pfe / 1 Feld</option>
    <option>2 Kn&ouml;pfe / 2 Felder</option>
    <option>3 Kn&ouml;pfe / 3 Felder</option>
    <option>4 Kn&ouml;pfe / 4 Felder</option>
    
    </select>
    </td>
    </tr>
    <tr> 
    <td class="editTableL">Titel des Formulars</td>
    <td class="editTableR"><input type="text" class="inputText" name="titel"></td>
    </tr>
    <tr>
    <td class="editTableL">Hilfe-Text</td>
    <td class="editTableR"><input type="text" class="inputText" name="hilfe"></td>
    </tr>
    <tr>
    <td class="editTableL">Bild:</td>
    <td class="editTableR"><input type="file" class="inputText" name="bilddatei" value="Durchsuchen"></td>
    </tr>
    ############ Eingabebereich 1 #################
    <tr id="Layer1"> 
    <td class="editTableL">Button 1 Name:</td>
    <td class="editTableR"><input type="text" class="inputText" name="buttonname1"></td>
    </tr>
    <tr id="Layer1">
    <td class="editTableL">Button 1 Beschriftung:</td>
    <td class="editTableR"><input type="text" class="inputText" name="buttonvalue1"></td>
    </tr>
    <tr id="Layer1">
    <td class="editTableL">Button 1 Aktion:</td>
    <td class="editTableR"><input type="text" class="inputText" name="buttonaction1"></td>
    </tr>
    ############### Eingabebereich 2 ################
    <tr id="Layer2">
    <td class="editTableL">Button 2 Name:</td>
    <td class="editTableR"><input type="text" class="inputText" name="buttonname2"></td>
    </tr>
    <tr>
    <td class="editTableL">Button 2 Beschriftung:</td>
    <td class="editTableR"><input type="text" class="inputText" name="buttonvalue2"></td>
    </tr>
    <tr>
    <td class="editTableL">Button 2 Aktion:</td>
    <td class="editTableR"><input type="text" class="inputText" name="buttonaction2"></td>
    </tr>
    ################# Eingabebereich 3 ##############
    <tr id="Layer3">
    <td class="editTableL">Button 3 Name:</td>
    <td class="editTableR"><input type="text" class="inputText" name="buttonname3"></td>
    </tr>
    <tr id="Layer3">
    <td class="editTableL">Button 3 Beschriftung:</td>
    <td class="editTableR"><input type="text" class="inputText" name="buttonvalue3"></td>
    </tr>
    <tr id="Layer3">
    <td class="editTableL">Button 3 Aktion:</td>
    <td class="editTableR"><input type="text" class="inputText" name="buttonaction3"></td>
    </tr>
    ################### Eingabebereich 4 #################
    <tr id="Layer4">
    <td class="editTableL">Button 4 Name:</td>
    <td class="editTableR"><input type="text" class="inputText" name="buttonname4"></td>
    </tr>
    <tr id="Layer4">
    <td class="editTableL">Button 4 Beschriftung:</td>
    <td class="editTableR"><input type="text" class="inputText" name="buttonvalue4"></td>
    </tr>
    <tr id="Layer4">
    <td class="editTableL">Button 4 Aktion:</td>
    <td class="editTableR"><input type="text" class="inputText" name="buttonaction4"></td>
    </tr>
    
    </table>
    <input type="submit" class="inputButton" name="button" value="Speichern" onClick="showlayer('Layer1','Layer2');">
    </form>

    Javascript:
    Code:
    function showlayer(layer1,layer2,layer3,layer4){
    
    var layer1details = layer1;
    var layer2details = layer2;
    
    
    if (layer1details!="" && layer2details!=""){
    document.getElementById(layer1).style.visibility='hidden';
    document.getElementById(layer2).style.visibility='hidden';
    }
    
    }
    So... jetzt funktioniert das ja das die 2 Zeilen verschwinden, aber...

    1. Verschwindet nur die 1. Zeile jeweils eines Eingabebereichs
    2. Verschwindet sie nur und rückt nicht nach, d.h. ich habe nun Lücken in der Tabelle und das ist unschön.

    Gibt es da noch eine andere Möglichkeit die ich nutzen könnte?

    Ich danke schonmal für euere Antworten

    MfG

    Martini


  • #2
    also eigentlichlich geht ja schon aus der abkürzung id hervor, dass das was eindeutiges sein soll...
    demnach mein tipp wenn du schon mit tabellen arbeitest, arbeite mit verschatelten tabellen und weiß die id einer tabelle zu und nicht eine id für 3 zeilen...
    mfg Floh

    Programmers don't die, they GOSUB without RETURN

    Kommentar


    • #3
      für die lücken würd ich mir mal ansehen was in selfhtml zum attribut visibility für werte gelistet werden... z.b. block, inline usw..
      mfg Floh

      Programmers don't die, they GOSUB without RETURN

      Kommentar


      • #4
        du kannst aber auch den tabellenzeilen eine class mitgeben, dann brauchst du keine verschachtelten tabellen machen. hierbei gibt es nur ein kleines problem, du kannst keine elemente mit einem class - name auswaehlen, hol dir dann einfach alle <tr> Elemente und pruefe die Klassennamen.
        - Das Leben ist eine Spirale, man kotzt immer in der selben Kurve.
        - Frauen behalten nur für sich, was sie nicht wissen.

        Kommentar

        Lädt...
        X