2017-02-15 29 views
0

我有以下XML數據,我想在每行顯示三列的食譜。我想在td中顯示標題,服務和配方標記的圖像節點,每行3個td,然後在下一行中搜索食譜。使用XSLT顯示每行三列的XML數據

<recipeList> 
    <recipe id="ch02_recipe020"> 
     <title>Spinach and zucchini frittata</title> 
     <serves>Serves 4</serves> 
     <ingredientList> 
      <ingredientEntry> 
       <ingredientQty>1 tablespoon</ingredientQty> 
       <keyIngredient>olive oil</keyIngredient> 
      </ingredientEntry> 
      <ingredientEntry> 
       <ingredientQty>1</ingredientQty> 
       <keyIngredient>red onion</keyIngredient>, thinly sliced 

      </ingredientEntry> 

     </ingredientList> 
     <prepSteps> 
      <prepStep> 
       <para>Heat the oil in a medium non-stick frying pan and fry the onion and zucchini over medium heat until they are a pale golden brown. Add the garlic and cook it for a minute. Add the spinach and cook until the spinach has wilted and any excess moisture has evaporated off — if you don't do this, your frittata will end up soggy in the middle, as the liquid will continue to come out as it cooks. Shake the pan so you get an even layer of mixture. Turn the heat down to low.</para> 
      </prepStep> 

     </prepSteps> 
     <figure> 
      <img src="images/01075/091.jpg" /> 
     </figure> 

    </recipe> 
    <recipe id="ch02_recipe026"> 
     <title>Bacon and avocado salad</title> 
     <serves>Serves 4</serves> 
     <ingredientList> 
      <ingredientEntry> 
       <ingredientQty>8</ingredientQty> 
       <keyIngredient>bacon rashers</keyIngredient>, rinds cut off 

      </ingredientEntry> 

     </ingredientList> 
     <prepSteps> 
      <prepStep> 
       <para>Turn on the grill (broiler). Put the bacon on a tray and grill on both sides until it is nice and crisp. Leave it to cool and then break into pieces.</para> 
      </prepStep> 
      <prepStep> 
       <para>Bring a saucepan of water to the boil and cook the beans for 4 minutes. Drain and then hold them under cold running water for a few seconds to stop them cooking any further.</para> 
      </prepStep> 

     </prepSteps> 
     <figure> 
      <img src="images/01075/103.jpg" /> 
     </figure> 

    </recipe> 
    <recipe id="ch02_recipe028"> 
     <title>Spinach salad with chicken and sesame dressing</title> 
     <serves>Serves 4</serves> 
     <ingredientList> 
      <ingredientEntry> 
       <ingredientQty>450 g (1 lb)</ingredientQty> 
       <keyIngredient>baby English spinach leaves</keyIngredient> 
      </ingredientEntry> 
      <ingredientEntry> 
       <ingredientQty>1</ingredientQty> 
       <keyIngredient>Lebanese (short) cucumber</keyIngredient>, peeled and diced 

      </ingredientEntry> 

     </ingredientList> 
     <prepSteps> 
      <prepStep> 
       <para>Put the spinach in a large bowl. Scatter the cucumber, spring onion and carrot over the top. Shred the chicken breast into long pieces and scatter it over the vegetables.</para> 
      </prepStep> 

     </prepSteps> 
     <figure> 
      <img src="images/01075/107.jpg" /> 
     </figure> 
     <file src="MB Pages/Lunch.qxd" /> 
    </recipe> 
    <recipe id="ch03_recipe025"> 
     <title>Tandoori chicken with cardamom rice</title> 
     <serves>Serves 4</serves> 
     <ingredientList> 
      <ingredientEntry> 
       <ingredientQty>250 ml (1 cup)</ingredientQty> 
       <keyIngredient>natural yoghurt</keyIngredient>, plus extra for serving 

      </ingredientEntry> 

     </ingredientList> 
     <prepSteps> 
      <prepStep> 
       <para>Soak eight wooden skewers in water for 30 minutes to prevent them burning during cooking. Combine the yoghurt, tandoori paste and lemon juice in a non-metallic dish. Add the chicken and coat well, then cover and marinate for at least 10 minutes.</para> 
      </prepStep> 

     </prepSteps> 
     <figure> 
      <img src="images/01075/174.jpg" /> 
     </figure> 
     <file src="MB Pages/Casual 124-185.qxd" /> 
    </recipe> 

</recipeList> 

我正在使用下面的XSLT,但它不顯示每行3條記錄。

<?xml version="1.0" encoding="UTF-8" ?> 
<!-- Designed by SoftServ Solutions, February 13, 2017 --> 
<xsl:stylesheet version="1.0" 
       xmlns:xsl="http://www.w3.org/1999/XSL/Transform" 
       xmlns:m="http://www.w3.org/1998/Math/MathML" 
       xmlns:xlink="http://www.w3.org/1999/xlink"> 
    <xsl:output method="html" indent="yes" encoding="windows-1252" /> 
    <xsl:preserve-space elements="*" /> 
    <xsl:template match="/"> 
     <html> 
     <head> 
      <title>Murdoch Books DIY</title> 
     </head> 
     <body> 
      <xsl:apply-templates select="recipeList" /> 
     </body> 
    </html> 
</xsl:template> 
<xsl:output indent="yes" /> 
<xsl:strip-space elements="*" /> 
<xsl:param name="cols">3</xsl:param> <!-- set the number of rows here --> 
<xsl:template match="recipeList"> 
    <table width="30%" align="center" border="1"> 
     <xsl:apply-templates select="recipe[position() mod $cols = 1 or position() = 1]" mode="row" /> 
    </table> 
</xsl:template> 

<xsl:template match="recipe" mode="row"> 
    <tr> 

     <xsl:apply-templates select=". | following-sibling::title[position() &lt; $cols]" mode="cell" /> 

    </tr> 
</xsl:template> 

<xsl:template match="recipe" mode="cell"> 
    <td> 
     <xsl:value-of select="title" /> 
     <xsl:value-of select="serves" /> 
     <br /> 
     <xsl:if test="figure"> 
      <xsl:apply-templates select="figure" /> 
     </xsl:if> 
    </td> 
</xsl:template> 
<xsl:template match="figure"> 
    <p align="left"> 
     <img width="25%" height="25%"> 
     <xsl:attribute name="src"> 
      <xsl:value-of select="img/@src" /> 
     </xsl:attribute> 
     </img> 
    </p> 
    <a> 
     <xsl:attribute name="name"> 
      <xsl:value-of select="@id" /> 
     </xsl:attribute> 
    </a> 
    <p> 
     <xsl:apply-templates select="caption" /> 
    </p> 
    <p> 
     <xsl:apply-templates select="source" /> 
    </p> 
</xsl:template> 
</xsl:stylesheet> 

任何人都可以請幫忙嗎?我是XSLT新手。

+0

您的要求不明確。你是否想要一張有3列的表格(每行一個配方,每個配方3個單元格),還是一張有9列的表格(每行3個配方,每個配備3個單元格)? –

+0

對不起,我不清楚。我需要一個每行3列的表格,每列都有食譜標題標籤和縮略圖圖像。如果我的搜索結果中有7條記錄,那麼我的表格將顯示3行,前2行有6個配方(3列),最後一行有一個配方(一列)。先謝謝你。 – Awadesh

回答

0

你需要改變這一部分:

<xsl:template match="recipe" mode="row"> 
    <tr> 

     <xsl:apply-templates select=". | following-sibling::title[position() &lt; $cols]" mode="cell" /> 

    </tr> 
</xsl:template> 

到:

<xsl:template match="recipe" mode="row"> 
    <tr> 

     <xsl:apply-templates select=". | following-sibling::recipe[position() &lt; $cols]" mode="cell" /> 

    </tr> 
</xsl:template> 

當你在它,你可以刪除這裏的冗餘:

<xsl:apply-templates select="recipe[position() mod $cols = 1 or position() = 1]" mode="row" /> 

並簡單說明:

<xsl:apply-templates select="recipe[position() mod $cols = 1]" mode="row" /> 

您也有兩個xsl:output元素,既<xsl:preserve-space elements="*" />xsl:strip-space elements="*" />這讓很少的感覺。這些只是我注意到的一些事情,可能還有更多。