Nils: ID dynamsich ändern

Moin Moin....

...ich hab ein kleines Problem, bei dem ich nicht weiterkomme.

Ich muß in einer Tabelle xml-Daten wiedergeben.
Dabei sollen die "geraden" Zeilen weiß, die "ungeraden" Zeilen grau sein.

Ich hab das schon mit einer Schleife versucht, die bei (Zeile%2 != 0)
die Hintergrundfarbe ändern soll.

Leider kann ich ja die ID der Zeile (<tr id="zeile">) nicht ändern und nach einem durchlauf erkennt der das Objekt nicht mehr.
Kann man die ID irgendwie auch dynamisch machen?

Danke für die Hilfe....

....Nils

  1. Hi,

    Dabei sollen die "geraden" Zeilen weiß, die "ungeraden" Zeilen grau sein.

    CSS/3.0 bietet dazu die Pseudoklasse :nth-child() an. Leider mangelt es an der Unterstützung seitens der Browser.

    Ich hab das schon mit einer Schleife versucht, die bei (Zeile%2 != 0)
    die Hintergrundfarbe ändern soll.

    Gangbarer Weg, wenn Dir klar ist, dass bei deaktiviertem JavaScript die Farben wie gehabt bleiben.

    Leider kann ich ja die ID der Zeile (<tr id="zeile">) nicht ändern und nach einem durchlauf erkennt der das Objekt nicht mehr.
    Kann man die ID irgendwie auch dynamisch machen?

    Wieso möchtest Du die ID ändern? An der IDentifikation des Elements ändert sich nichts.

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    1. Hi Cheatah,

      beim 1. Durchlauf der Schleife ändert er die Farbe.
      Danach fehlt irgendwie der Bezug zum Objekt.

      Also denke ich mal, das in der Schleife die ID geändert werden muß, oder?

      1. Hi,

        beim 1. Durchlauf der Schleife ändert er die Farbe.
        Danach fehlt irgendwie der Bezug zum Objekt.

        der Bezug darf nicht geändert werden. Wieso durchläufst Du die Tabelle eigentlich mehrmals?

        Also denke ich mal, das in der Schleife die ID geändert werden muß, oder?

        Nein, auf keinen Fall. Die Identifikation der Zeile zu verändern ist - sowohl theoretisch als auch offenbar - das Letzte, was Du willst.

        Cheatah

        --
        X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
        X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
        X-Will-Answer-Email: No
        X-Please-Search-Archive-First: Absolutely Yes
        1. Das ist eine Tabelle, die dynamisch mit XML Daten versorgt wird.
          Also ich weiß nicht wie viele Zeilen es gibt.
          Diese "Tabelle" wird in einer  xsl:for-each Schleife erstellt.

          Er ändert aber lediglich die erste Zeile.
          Wieso auch immer!?!??!?

          1. Hi,

            Diese "Tabelle" wird in einer  xsl:for-each Schleife erstellt.

            also ist es ein XSLT-, kein DHTML-Problem?

            Er ändert aber lediglich die erste Zeile.
            Wieso auch immer!?!??!?

            Keine Ahnung, ich kann erst wieder ab Mittwoch hellsehen.

            Kannst Du bitte Dieters Aufforderung nachkommen?

            Cheatah

            --
            X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
            X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
            X-Will-Answer-Email: No
            X-Please-Search-Archive-First: Absolutely Yes
            1. Das Skript habe ich mal hochgeladen....

              vielleicht ist es denn ein wenig verständlicher?

              Nils

          2. Hi,

            Wieso auch immer!?!??!?

            weil mit dem Attribut id ein dateiweit eindeutiger Bezeichnername vergeben wird, der auch nur ein einziges Mal im Dokument vorkommen darf.

            MfG Hopsel

            --
            "It's amazing I won. I was running against peace, prosperity, and incumbency."
            George W. Bush speaking to Swedish Prime Minister unaware a live television camera was still rolling, June 14, 2001
  2. Hallo Nils,

    Kannst Du deinen Code mal posten?

    Gruß,

    Dieter

    1. Klar....

      <table>
      <xsl:for-each select="SATZ">
         <tr id="id1">

      <script language="JavaScript" type="text/javascript">
           var el = document.getElementById("id1");
           var count = <xsl:value-of select="position()"/>;
           var mod = (count%2);

      if(mod != 0)
           {
            el.style.backgroundColor="#00ffcc";
           }
           else
           {
            el.style.backgroundColor="#aabbcc";
           }
          </script>

      <td>
           Satz<xsl:value-of select="position()"/>&#160;
          </td>
          <td class="courier" >
           <xsl:value-of select="Name"/>&#160;
          </td>
          <td class="courier">
           <xsl:value-of select="Vorname"/>&#160;
          </td>
          <td class="courier">
           <xsl:value-of select="Datum"/>&#160;
          </td>
          <td class="courier">
           <xsl:value-of select="MA-NR"/>&#160;
          </td>

      </xsl:for-each>
         </table>

      1. Hallo Nils,

        Meine XML-Kenttnisse sind leider bescheiden, aber vom Javascript-Standpunkt aus wuerde ich das anders machen

        var el = document.getElementById("id1");

        hier wuerde ich document.getElementsByTagName('tr') oder ('td') verwenden, dann hast du alle Zeilen/Zellen in einem Array, durch das du mit for durchgehen kannst. Moeglicherweise musst du dann noch eine 2. Bedingung einbauen, falls Du dich nicht auf alle Zeilen beziehst, sondern nur auf jene, die einen bestimmten parentNode haben (oder einen bestimmten className, wie auch immer.

        el.style.backgroundColor="#00ffcc";

        Ich wuerde eher die Eigenschaft className aendern, weil du dann die Klasse von ausserhalb in einem Stylesheet jederzeit aendern kannst.

        <td class="courier" >

        Wenn courier bedeutet, dass die Zelle die Schriftart Courier hat, ist der Klassenname schlecht gewaehlt, morgen wird die Lucida Console vielleicht besser gefallen.

        Die letzten beiden Anmerkungen haben natuerlich nichts mit deinem Problem zu tun. Denk trotzdem mal drueber nach.

        Gruß,

        Dieter

      2. Hi,

        <script language="JavaScript" type="text/javascript">
             var el = document.getElementById("id1");
             var count = <xsl:value-of select="position()"/>;

        Du vermischst hier zwei Welten miteinander, die völlig voneinander getrennt sind. Der XSLT-Code kommt entweder beim Client gar nicht erst an, oder er wird dort als allererstes ersetzt. In Folge dessen erzeugst Du hier in jeder einzelnen Zeile auf's Neue den selben JavaScript-Code - zudem an ungültiger Stelle. Die dahinter stehende Funktionalität kannst Du im übrigen komplett durch XSLT handhaben lassen, ganz ohne JavaScript.

        Cheatah

        --
        X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
        X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
        X-Will-Answer-Email: No
        X-Please-Search-Archive-First: Absolutely Yes
        1. Hi,

          <script language="JavaScript" type="text/javascript">
               var el = document.getElementById("id1");
               var count = <xsl:value-of select="position()"/>;

          Du vermischst hier zwei Welten miteinander, die völlig voneinander getrennt sind. Der XSLT-Code kommt entweder beim Client gar nicht erst an, oder er wird dort als allererstes ersetzt. In Folge dessen erzeugst Du hier in jeder einzelnen Zeile auf's Neue den selben JavaScript-Code - zudem an ungültiger Stelle.

          Das stimmt so nicht. Ich hab mir die Werte mal ausgeben lassen. Da bekomm ich ganz genau die Werte die ich haben will.

          Die dahinter stehende Funktionalität kannst Du im übrigen komplett durch XSLT handhaben lassen, ganz ohne JavaScript.

          Und wie geht das?

          Cheatah

          1. Hi,

            Du vermischst hier zwei Welten miteinander, die völlig voneinander getrennt sind. Der XSLT-Code kommt entweder beim Client gar nicht erst an, oder er wird dort als allererstes ersetzt. In Folge dessen erzeugst Du hier in jeder einzelnen Zeile auf's Neue den selben JavaScript-Code - zudem an ungültiger Stelle.
            Das stimmt so nicht. Ich hab mir die Werte mal ausgeben lassen. Da bekomm ich ganz genau die Werte die ich haben will.

            ich habe nicht bezweifelt, dass nicht die Werte kommen, welche Du gerne hättest. Meine Zweifel betreffen eher Deine Wünsche an sich.

            Die dahinter stehende Funktionalität kannst Du im übrigen komplett durch XSLT handhaben lassen, ganz ohne JavaScript.
            Und wie geht das?

            Was meinst Du damit? Du hantierst doch bereits recht kreativ mit XSLT. Nutze Dein Wissen.

            Cheatah

            --
            X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
            X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
            X-Will-Answer-Email: No
            X-Please-Search-Archive-First: Absolutely Yes
      3. Hi,

        <xsl:for-each select="SATZ">
           <tr id="id1">

        Sollte es mehr als ein SATZ-Element im XML geben, erzeugst Du invaliden HTML-Code, da es mehrere Elemente mit derselben Id gibt.
        Das ist in (X)HTML nicht zulässig.

        <script language="JavaScript" type="text/javascript">
             var el = document.getElementById("id1");
             var count = <xsl:value-of select="position()"/>;

        Warum erzeugst Du nicht gleich im XSLT verschiedene ids bzw. verschiedene class- oder style-Attribute?

        cu,
        Andreas

        --
        Warum nennt sich Andreas hier MudGuard?
        Schreinerei Waechter
        Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
  3. Hallo Nils,

    mit getElementById kommst Du an die Tabelle, und mit get ElementsByTagname kommst Du an die Zeilen deren CSS-Eigenschaften Du dann in einer for-Schleife mit Zweiersprung anpassen kannst.

    Siehe z.B. http://de.selfhtml.org/javascript/objekte/document.htm und http://de.selfhtml.org/javascript/objekte/node.htm.

    Ungetestetes Codebeispiel:

      
     var tab=document.getElementById("Id_der_Tabelle");  
     var tbdy=tab.getElementsByTagName("tbody")[0];  
     var tz=tbdy.getElementsByTagName("tr");  
     var nzeilen=tz.length;  
      for (z=1;z<nzeilen;z+=2) {  
        tz[z].style="backgroundColor:#808080"; // oder .bgColor=...  
      }  
    
    

    Gruß, Jürgen