Said: Tabellen DIV und display = 'block'; display = 'none';

Hay alle zusammen

Ich habe ein Problem womit ich einfach nicht weiterkommen Der Code der Seite ist jetzt zuviel deswegen versuche ichs zu erklären ohne de code zu posten.

Es geht um ein formular.
Ich habe eine Tabelle (Haupttabelle) in dieser Tabelle verschiedene Spalten und Zeilen in einer Zeile habe ich dann eine <div id="id"> ... und in dieser Div habe ich eine weitere tabelle(untertabelle) mit spalten zeilen und inhalten. </div> wird geschlossen dann gehts weiter mit inhalten der anderen haupttabelle.

Ok jetzt möchte ich diese Untertabelle in der DIv ersteinmal nicht sichtbar haben sondern erst wenn man im Formular auf eine chekbox klickt.Das ganze hab ich als Javascript Funktion ausgelagert so das die Tabelle bei ausgeschaltetem JS trotzdem sichtbar ist. entsprechendes Javascript hab ich gemacht und das Onclick event für die Box auch funktioniert für sich genommen auch alles super. bei Klick auf die chekbox klappt die Haupttabelle normal auf (das seh ich am rahmen der genau die grösse kriegt wie wenn die andere UnterTabelle sichtbar ist) aber ich sehe den Inhalt der UnterTabelle die im Div ist nicht. Es ist alles weiss. Sobald ich die Div mit der UntertabelleTabelle drin aus der anderen rauskopiere und zum beispiel darunter setze sprich aus der Haupttabelle raus funktionierts einwandfrei. Das will ich aber nicht da ich ja will das das ganze ding wie eine Tabelle aussieht und der rahmen sich verschieben soll beim aufklappen. Woran kann es liegen das es in der Haupttabelle nicht angezeigt wird.??
Liebe Grüsse
Said

  1. Hi,

    Ich habe ein Problem womit ich einfach nicht weiterkommen Der Code der Seite ist jetzt zuviel deswegen versuche ichs zu erklären ohne de code zu posten.

    Wie wär's, wenn Du die Seite im Internet verfügbar machst? Dann könnte man sich das anschauen.

    Ok jetzt möchte ich diese Untertabelle in der DIv ersteinmal nicht sichtbar haben sondern erst wenn man im Formular auf eine chekbox klickt.Das ganze hab ich als Javascript Funktion ausgelagert so das die Tabelle bei ausgeschaltetem JS trotzdem sichtbar ist. entsprechendes Javascript hab ich gemacht und das Onclick event für die Box auch funktioniert für sich genommen auch alles super. bei Klick auf die chekbox klappt die Haupttabelle normal auf (das seh ich am rahmen der genau die grösse kriegt wie wenn die andere UnterTabelle sichtbar ist) aber ich sehe den Inhalt der UnterTabelle die im Div ist nicht. Es ist alles weiss. Sobald ich die Div mit der UntertabelleTabelle drin aus der anderen rauskopiere und zum beispiel darunter setze sprich aus der Haupttabelle raus funktionierts einwandfrei. Das will ich aber nicht da ich ja will das das ganze ding wie eine Tabelle aussieht und der rahmen sich verschieben soll beim aufklappen. Woran kann es liegen das es in der Haupttabelle nicht angezeigt wird.??

    So ist das nicht wirklich nachvollziehbar. Ist der Code valide (sprich: zumindest korrekt geschachtelt?)

    cu,
    Andreas

    --
    Warum nennt sich Andreas hier MudGuard?
    O o ostern ...
    Fachfragen per Mail sind unverschämt, werden ignoriert. Das Forum existiert.
  2. Hi,

    Woran kann es liegen das es in der Haupttabelle nicht angezeigt wird.??

    Da du zwar sehr prosaisch ein Szenario beschreibst, aber Fakten, die das Problem nachvollziehbar machen, so gut wie komplett schuldig bleibst (lese bitte die Tipps für Fragende [noch] mal, und berücksichtige sie auch), kann ich nur raten - dass du im Titel display="block" erwähnt hast, lässt vermuten, dass du diesen display-Wert für die Tabelle vergeben haben könntest. Das ist aber problematisch, weil das nicht der *richtige* display-Wert für Tabellen ist - der lautet "table". Da der IE diesen nicht versteht, andere Browser aber darauf bestehen, um eine Tabelle richtig als Tabelle darzustellen, weist man der display-Eigenschaft in so einem Falle am besten einfach einen Leerstring zu, woraufhin jeder Browser seinen Defaultwert für ein Table-Element wieder herstellt.

    MfG ChrisB

    --
    Light travels faster than sound - that's why most people appear bright until you hear them speak.
    1. mh ok dann versuche ich das mal mit code auszügen kurz zu beschreiben vielleicht seht ihr ja woran es liegt. Also ich hab ein hauptformular in einer tabelle und in dieser tabelle ist ein erweiterungsformular mit anderen daten die aber nur sichtbar sein sollen wenn wenn ein radiobutton aktiviert ist

      Es handelt sich um folgenden codeauszug:

        
             <div>  
              <form action="" method="post" enctype="multipart/form-data" name="edit_profil">  
              <table width="600" border="0" cellpadding="5" cellspacing="0" class="login">  
                <tr>  
                  <th colspan="3" background="bilder/bookmark_bg.jpg">Mein Profil</th>  
                </tr>  
                     <?php if(isset($error) && $error == true && $error_msg != ''){?>  
                <tr>  
                  <td colspan="3" align="left" class="error_text"><?php echo $error_msg;?></td>  
                </tr>  
                <?php }?>  
                <?php if(isset($msg) && $msg != ''){?>  
                <tr>  
                  <td colspan="3" valign="top" bgcolor="#A6C521" class="msg_text"><?php echo $msg;?></td>  
                </tr>  
        
                <?php }?>  
                <tr>  
                  <td colspan="3" align="left" valign="top" bgcolor="#F0F0F0">**************** Standartprofil</td>  
                </tr>  
                <tr>  
                  <td width="142" align="right">Benutzername:*</td>  
                  <td width="218"><label>  
                    <input name="benutzername" type="text" id="benutzername" value="<?php echo $user_daten['username']?>" />  
                    <img src="bilder/icon_benutzername.png" width="30" align="absmiddle" /></label></td>  
                  <td width="218" align="right"><label>  
                    <input type="submit" name="submit" id="submit" value="Profil Ändern" />  
                    <input name="aktion" type="hidden" id="aktion" value="profil_update" />  
                  </label></td>  
                </tr>  
                <tr>  
                  <td align="right">Emailadresse:*</td>  
                  <td colspan="2"><label>  
                    <input name="email" type="text" id="email" value="<?php echo $user_daten['email']?>" />  
                    <img src="bilder/icon_email.png" width="30" align="absmiddle" /></label></td>  
                </tr>  
                <tr>  
                  <td align="right">Neues Passwort:</td>  
                  <td colspan="2"><input name="passwort" type="password" id="passwort" />  
                    <img src="bilder/schluessel.png" alt="neues passwort" width="30" /></td>  
                </tr>  
                <tr>  
                  <td align="right">Passwort bestätigen</td>  
                  <td colspan="2"><input name="passwort2" type="password" id="passwort2" />  
                    <img src="bilder/schluessel_wiederholen.png" alt="Passwort" width="30" /></td>  
                </tr>  
                <tr>  
                  <td align="right">Standard Sprache der Seite:</td>  
                  <td colspan="2"><label>  
                    <select name="sprachen" id="sprachen">  
                      <?php  
      			  $sprachen_holen = mysql_query("SELECT * FROM koran_sprache_seite ORDER BY id");  
      			  while($sprache_listen = mysql_fetch_array($sprachen_holen)){  
      			  $user_holen = mysql_query("SELECT * FROM koran_user WHERE id = '".$_SESSION['benutzer_id']."'");  
      			  $user = mysql_fetch_array($user_holen);  
      			  if($sprache_listen['id'] == $user['sprache']){?>  
                      <option value="<?php echo $sprache_listen['id'];?>" selected="selected"><?php echo $sprache_listen['sprache'];?></option>  
                      <?php }else{?>  
                      <option value="<?php echo $sprache_listen['id'];?>"><?php echo $sprache_listen['sprache'];?></option>  
                      <?php }?>  
                      <?php }?>  
                    </select>  
                    <img src="bilder/icon_sprachen.png" alt="" width="30" align="absmiddle" /> </label></td>  
                </tr>  
                <tr>  
                  <td colspan="3" align="left" bgcolor="#F0F0F0">**************** Heiratsprofil (Optional) Was ist das?</td>  
                  </tr>  
                <tr>  
                  <td width="142" align="right" valign="top">Bist du single und hast du Heiratsabsichten?</td>  
                  <td colspan="2"><label>  
      <input type="radio" name="heiratsabsichten" id="radio" value="ja" onclick="Sichtbar();" <?php if($user_daten['single_status'] == true){ ?>checked="checked" <?php }?>/>  
      ja </label>  
                    <input name="heiratsabsichten" type="radio" id="radio2" value="nein" <?php if($user_daten['single_status'] == false){ ?>checked="checked" <?php }?> onclick="UnSichtbar();" />  
                    nein </td>  
                </tr>  
                <tr >  
                <div id="heiratsabsichten_optionen">  
                <td height="1" colspan="3" align="center" valign="top" >  
        
                 <table width="550" cellpadding="3" cellspacing="3">  
                   <tr>  
                     <td colspan="2" valign="top" class="quellen">  
                       <div align="left">Wenn du ernste Heiratsabsichten hast klicke bitte auf Ja!. <br />  
                         Ein Bild von dir, dein Postleitzahlengebiet und die Geschlechtsangabe sind in dem Fall Pflichtfelder.</div></td>  
                   </tr>  
                   <tr>  
                     <td width="142" align="right">Geschlecht*:</td>  
                     <td><label for="for" radio3="radio3"> Ich bin ein Mann  
                         <input type="radio" name="geschlecht" id="radio3" value="m" <?php if($user_daten['geschlecht'] == "m"){ ?>checked="checked" <?php }?> />  
                       </label>  
                         <label for="for" radio4="radio4"> Ich bin eine Frau  
                           <input type="radio" name="geschlecht" id="radio4" value="f" <?php if($user_daten['geschlecht'] == "f"){ ?>checked="checked" <?php }?>/>  
                         </label>               </td>  
                   </tr>  
                   <tr>  
                     <td align="right">Postleitzahlbereich*:</td>  
                     <td><label>  
                       <input name="profil_plz" type="text" id="profil_plz" maxlength="5" value="<?php if($user_daten['profil_plz'] != ""){  echo $user_daten['profil_plz']; }?>"/>  
                     </label></td>  
                   </tr>  
                   <tr>  
                     <td align="right">Dein Bild*<br />  
                     erlaubt: jpg, gif oder png:</td>  
                     <td><label>  
                       <input type="file" name="profil_bild" id="profil_bild" />  
                     </label></td>  
                   </tr>  
                   <?php if(****){ ?>  
                   <tr>  
                     <td align="right">Aktuelles Bild</td>  
                     <td><img src="bilder/user/<?php echo ***;?>" width="200" /></td>  
                   </tr>  
                   <tr>  
                     <td align="right">Status deines Bildes</td>  
                     <td> USernamen udn so</td>  
                   </tr>  
                   <?php }?>  
                   <tr>  
                     <td align="right">Was sollten andere über dich wissen?</td>  
                     <td><label>  
                       <textarea name="profil_text" id="profil_text" cols="45" rows="10"></textarea>  
                     </label></td>  
                   </tr>  
                 </table>  
                <table width="550">  
                <tr>  
                  <td>&nbsp;</td>  
                  <td align="right"><label>  
                    <input type="submit" name="submit" id="submit" value="Profil Ändern" />  
                    <input name="aktion" type="hidden" id="aktion" value="profil_update" />  
                  </label></td>  
                </tr>  
              </table>        </td>  
              </div>  
                  </tr>  
                </table>  
              </form>  
              </div>  
      
      

      Alle PHP Tags die wichtzige Dqaten betreffen hab ich durch sternchen ersetzt. die onclick events sehen folgendermassen aus:

        
        
      <script type="text/javascript">  
      function Sichtbar() {  
      document.getElementById("heiratsabsichten_optionen").style.display  = 'block';  
      }  
      function UnSichtbar() {  
      document.getElementById("heiratsabsichten_optionen").style.display  = 'none';  
      }  
      </script>
      

      ich hoffe ihr klönnt mir weiterhelfen sonst muss ich das anders lösen.
      mit freundlichen Grüssen
      Said

      1. Hi,

        mh ok dann versuche ich das mal mit code auszügen kurz zu beschreiben vielleicht seht ihr ja woran es liegt.

        1. und zum x-ten Male: Bitte keinen serverseitigen Code posten, wenn ein clientseitiges Problem diskutiert werden soll!

        2. Erst mal valides HTML herstellen.
        Derzeit hast du TR DIV TD in deinem Quellcode (und zwar genau an der "problematischen" Stelle), was eine ungültige Verschachtelung darstellt.

        MfG ChrisB

        --
        Light travels faster than sound - that's why most people appear bright until you hear them speak.
        1. ja das wart ein weiterer versuch das DIV nach dem TR einzubauen hatte es vorher zso TR TD DIV dann kam die neue TABLE auch da wird es nicht korrekt angezeigt.mach ich das ganze dann statt

          <script type="text/javascript">  
          function Sichtbar() {  
          document.getElementById("heiratsabsichten_optionen").style.display  = '';  
          }  
          function UnSichtbar() {  
          document.getElementById("heiratsabsichten_optionen").style.display  = 'none';  
          }  
          </script>
          

          mit

          <script type="text/javascript">  
          function Sichtbar() {  
          document.getElementById("heiratsabsichten_optionen").style.visibility = 'visible ';  
          }  
          function UnSichtbar() {  
          document.getElementById("heiratsabsichten_optionen").style.visibility = 'hidden';  
          }  
          </script>
          

          dann funktioniert alles einwandfrei nur hat dann die Haupttabelle schon von anfang an die Grösse als Wäre dieses Formularfeld sichtbar und genau das will ich nicht.

          Hochladen geht nciht da man sich einloggen muss um dieses formular zu sehen kann das aber mal versuchen gleich einfach nur die tabellen um die es geht dementsprechend zu machen und dann als neue seite hochzuladen. ich probiere jetzt mal andere visibility typen. vielleicht gehts ja damit.

          Liebe Grüsse
          Said

        2. Ok ändere ich mein visibility auf inherit und collapse macht er in mozilla genau das was ich will nur sagt mir jetzt der internet explorer das er das argument collapse nicht kennt. :( man man amn das es da keine standarts gibt für jeden browser.

            
          <script type="text/javascript">  
          function Sichtbar() {  
          document.getElementById("heiratsabsichten_optionen").style.visibility   = 'inherit';  
          }  
          function UnSichtbar() {  
          document.getElementById("heiratsabsichten_optionen").style.visibility  = 'collapse';  
          }  
          </script>
          

          der tag auf den das javascript zugreifen soll ist folgender

            
                 <tr>  
                   <td>  
                   <div id="heiratsabsichten_optionen">  
                     <table width="550" cellpadding="3" cellspacing="3">  
                       <tr>  
                         <td colspan="2" valign="top" class="quellen">  
          .................  
          
          
      2. Hallo,

        Es handelt sich um folgenden codeauszug:
        [viel Code]
                  <tr >
                  <div id="heiratsabsichten_optionen">
                  <td height="1" colspan="3" align="center" valign="top" >

        das ist ungültiges HTML, diese Schachtelung ist nicht zulässig: tr darf als Kindelement nur td oder th haben.

        Was die Fehlerkorrektur des Browsers intenr wirklich daraus macht, kann ich nicht sagen. Aber mit CSS oder Javascript auf ein fehlerhaftes HTML-Gerüst aufzubauen, führt oft zu unvorhersehbaren Ergebnissen.

        So long,
         Martin

        --
        Es existiert kein Weg, "für" etwas zu optimieren, sondern nur gegen alles andere.
          (Cheatah)
      3. könnt ihr diesen ebitrag bitte löschen da da Datenbankdaten drin sind ich kann ihn selber nicht mehr editieren. Danke