Geht das eigentlich auch, dass ich mir zuerst alle Autos anzeigen lasse und dann in der Gesamtübersicht nen Link anklicke, der mir dann nur noch die Maseratis in ner Gesamtübersicht anzeigt?
Also so wie´s bis jetzt ist nur, dass noch ne Gesamtübersicht mit allen Autos vorgeschaltet ist.
Hab jetzt folgenden XML-Code:
<?xml version="1.0"?> <?xml-stylesheet href="autos_xsl.xsl" type="text/xsl" ?>
<autos> <auto> <marke xml:link="simple" naechster="Maserati" href="mas1.xml">Maserati</marke> <modell>Biturbo Coupé</modell> <foto quelle="Maserati1.jpg"></foto> <foto2 quelle="Maserati1_gross.jpg"></foto2> <preis>EUR 1.111</preis> <adresse> <name>Helmut Müller</name> <strasse>Schustereck 5</strasse> <plz>66709</plz> <ort>Rappweiler</ort> </adresse> <ps>75</ps> <EZ>06/1984</EZ> <art>Coupé</art> <farbe>schwarz</farbe> <kilometer>100.000km</kilometer> <extras>/</extras> <kraftstoff>Benzin</kraftstoff> <getriebe>Automatik</getriebe> </auto>
<auto> <marke xml:link="simple" naechster="Audi" href="audi.xml">Audi</marke> <modell>Audi A8</modell> <foto quelle="Audi.jpg"></foto> <foto2 quelle="Audi_gross.jpg"></foto2> <preis>EUR 12.000</preis> <adresse> <name>Donald Duck</name> <strasse>Feldweg 3</strasse> <plz>54621</plz> <ort>Entenhausen</ort> </adresse> <ps>125</ps> <EZ>10/2001</EZ> <art>4-Türer</art> <farbe>silber</farbe> <kilometer>40.000km</kilometer> <extras>Klimaanlage <extra>Automatik</extra> <extra>Nebelscheinwerfer</extra> <extra>Sitzheizung</extra> </extras> <kraftstoff>Benzin</kraftstoff> <getriebe>Handschaltung</getriebe> </auto>
<auto> <marke xml:link="simple" naechster="Maserati" href="mas2.xml">Maserati</marke> <modell>Maserati Sportswagon</modell> <foto quelle="Maserati2.jpg"></foto> <foto2 quelle="Maserati2_gross.jpg"></foto2> <preis>EUR 87.000</preis> <adresse> <name>Fred Feuerstein</name> <strasse>Steinbruch 5</strasse> <plz>66679</plz> <ort>Losheim am See</ort> </adresse> <ps>340</ps> <EZ>05/2005</EZ> <art>Cabrio</art> <farbe>blau</farbe> <kilometer>25.000km</kilometer> <extras>Klimaanlage <extra>Automatik</extra> <extra>Nebelscheinwerfer</extra> <extra>Sitzheizung</extra> <extra>Ledersitze</extra> </extras> <kraftstoff>Benzin</kraftstoff> <getriebe>Handschaltung</getriebe> </auto> </autos>
Mein XSL-Code:
<?xml version="1.0" encoding="ISO-8859-1"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/"> <html> <head> <title>Autoliste</title>
<style type="text/css"> .einzeln { display:none; }
th { background-color: #B4CEA7; }
.spalte { background-color: #B4CEA7; font-weight: bold; width=140; }
.daten { background-color: #F7F9C1; width=100; }
</style>
<script type="text/javascript"> var arrAutos = new Array(<xsl:apply-templates select="autos" mode="jsarray" />); var autosTabelle = "<xsl:value-of select="generate-id(autos)" />"; <![CDATA[ function displayLayer(strID) { document.getElementById(strID).style.display = "block"; }
function hideLayer(strID) { document.getElementById(strID).style.display = "none"; }
function showAuto(strID) { for(i=0; i<=arrAutos.length-1; i++) { if(arrAutos[i] != strID) { hideLayer(arrAutos[i]); } else displayLayer(strID); } } ]]> </script> </head> <body> <xsl:apply-templates select="autos" mode="alle" /> <xsl:apply-templates select="autos" mode="einzeln" /> </body> </html> </xsl:template>
<xsl:template match="autos" mode="alle"> <div id="{generate-id(.)}"> <h1>Autoliste</h1> <p/> <table border="1"> <tr> <th>Nr.</th> <th>Foto</th> <th>Marke</th> <th>Modell</th> <th>Preis</th> <th>Adresse</th> <th>PS</th> <th>Erstzulassung</th> <th>Bauart</th> <th>Farbe</th> <th>Kilometerleistung</th> <th>Extras</th> </tr> <xsl:apply-templates select="auto[marke='Maserati']" mode="alle"/> </table> </div> </xsl:template>
<xsl:template match="auto" mode="alle"> <xsl:variable name="ID" select="generate-id(.)" /> <tr> <td> <xsl:number format="1"/> </td> <td> <xsl:apply-templates select="foto"/> </td> <td align="center" width="90"> <a href="#" onclick="hideLayer(autosTabelle);showAuto('{$ID}');"><xsl:value-of select="marke" /></a> </td> <xsl:apply-templates select="modell | preis" mode="alle"/> <xsl:apply-templates select="adresse" mode="alle"/> <xsl:apply-templates select="ps | EZ | art | farbe | kilometer | extras" mode="alle"/> </tr> </xsl:template>
<xsl:template match="foto"> <img align="left"> <xsl:attribute name="src"><xsl:value-of select="@quelle"/></xsl:attribute> </img> </xsl:template>
<xsl:template match="foto2"> <img align="center"> <xsl:attribute name="src"><xsl:value-of select="@quelle"/></xsl:attribute> </img> </xsl:template>
<xsl:template match="modell | preis" mode="alle"> <td> <xsl:value-of select="."/> </td> </xsl:template>
<xsl:template match="adresse" mode="alle"> <td> <xsl:value-of select="plz"/><br></br> <xsl:value-of select="ort"/> </td> </xsl:template>
<xsl:template match="ps | EZ | art | farbe | kilometer | extras" mode="alle"> <td> <xsl:value-of select="."/> </td> </xsl:template>
<xsl:template match="autos" mode="einzeln"> <xsl:apply-templates select="auto" mode="einzeln" /> </xsl:template>
<xsl:template match="auto" mode="einzeln"> <div id="{generate-id(.)}" class="einzeln"> <table border="1"> <tr> <th colspan="3"> <xsl:value-of select="modell" /> </th> </tr> <tr> <td class="spalte">Preis</td> <td class="daten"><xsl:value-of select="preis" /></td> <td rowspan="10" width="400" align="center"> <xsl:apply-templates select="foto2"/> </td> </tr> <tr> <td class="spalte">Adresse</td> <xsl:apply-templates select="adresse" mode="einzeln"/> </tr> <tr> <td class="spalte">PS</td> <td class="daten"><xsl:value-of select="ps" /></td> </tr> <tr> <td class="spalte">Erstzulassung</td> <td class="daten"><xsl:value-of select="EZ" /></td> </tr> <tr> <td class="spalte">Bauart</td> <td class="daten"><xsl:value-of select="art" /></td> </tr> <tr> <td class="spalte">Farbe</td> <td class="daten"><xsl:value-of select="farbe" /></td> </tr> <tr> <td class="spalte">Kilometerleistung</td> <td class="daten"><xsl:value-of select="kilometer" /></td> </tr> <tr> <td class="spalte">Extras</td> <td class="daten"><xsl:value-of select="extras" /></td> </tr> <tr> <td class="spalte">Kraftstoffart</td> <td class="daten"><xsl:value-of select="kraftstoff" /></td> </tr> <tr> <td class="spalte">Getriebe</td> <td class="daten"><xsl:value-of select="getriebe" /></td> </tr> </table> <p> <a href="#" onclick="hideLayer('{generate-id(.)}');displayLayer(autosTabelle);">Gesamtübersicht anzeigen</a> </p> </div> </xsl:template>
<xsl:template match="adresse" mode="einzeln"> <td class="daten"> <xsl:value-of select="name"/><br></br> <xsl:value-of select="plz"/><br></br> <xsl:value-of select="ort"/> </td> </xsl:template>
<xsl:template match="autos" mode="jsarray"> <xsl:for-each select="auto"> xsl:text"</xsl:text><xsl:value-of select="generate-id(.)" />xsl:text"</xsl:text><xsl:if test="position() != last()">xsl:text, </xsl:text></xsl:if> </xsl:for-each> </xsl:template> </xsl:stylesheet>
Hab beide Codes ein wenig angepasst. Jetzt siehts halt optisch schöner aus und in der Einzelansicht werden mehr Infos angezeigt als in der Gesamtansicht.
Und wieder die Frage: Wie muss ich meinen XSL-Code anpassen, damit das so klappt, wie ich das oben beschrieben habe? Hab schon fast zwei Stunden dran rumgedoktort, aber ich bekomms einfach nicht zum Laufen.
Viele Grüße, Masipulami