[SharePoint 2010] Enlever les apostrophes pour JavaScript en XSLT

Je suis tombé récemment sur un petit problème pour générer le rendu d’une liste SharePoint grâce à mon fichier XSLT. En utilisant des fonctions JavaScript,  je devait passer certains champs (Titre et description dans mon cas) en paramètres, comme ceci:

<a href="#" onclick="ModalDialog('{@Title}','{@Comment}'); return false">
  <div>...</div>
</a>

Dans certains cas, j’avais un message d’erreur JS.

Après plusieurs recherches, il s’avère que les données, venant d’un fichier XML, peuvent donc contenir des apostrophes et votre rendu HTML ne sera pas fiable du tout !

J’ai donc trouver une solution simple et qui marche à tout les coups, il faut remplacer les apostrophes par des \’ lors de la génération de votre code.

Il faut d’abord, créer une fonction XSLT :

<xsl:template name="globalReplace">
  <xsl:param name="source"/>
  <xsl:param name="from"/>
  <xsl:param name="to"/>
  <xsl:choose>
    <xsl:when test="contains($source,$from)">
      <xsl:value-of select="concat(substring-before($source,$from),$to)"/>
      <xsl:call-template name="globalReplace">
        <xsl:with-param name="source"  select="substring-after($source,$from)"/>
        <xsl:with-param name="from" select="$from"/>
        <xsl:with-param name="to" select="$to"/>
      </xsl:call-template>
    </xsl:when>
    <xsl:otherwise>
      <xsl:value-of select="$source"/>
    </xsl:otherwise>
  </xsl:choose>
</xsl:template>

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, « Courier New », courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

Il s’agit d’une simple fonction standard qui remplace un caractère/un texte par autre chose.

Vous voyez peut-être déjà ou je veux en venir, il suffit maintenant de créer dans votre fonction récursive qui génère vos éléments, une variable qui appellera la fonction ci-dessus :

<xsl:template match="Row">
  <xsl:variable name="escapedtitle">
    <xsl:call-template name="globalReplace">
      <xsl:with-param name="source" select="Title"/>
      <xsl:with-param name="from">'</xsl:with-param>
      <xsl:with-param name="to">\'</xsl:with-param>
    </xsl:call-template>
  </xsl:variable>
  .../...
  <a href="#" onclick="ModalDialog('{$escapedtitle}','{@Comment}'); return false">
    <div>...</div>
  </a>
</xsl:template>

Et ensuite, dans votre fonction JavaScript, faire appel à cette variable pour obtenir votre fonction qui ne génèrera plus d’erreur !

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, « Courier New », courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, « Courier New », courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

Publicité

Étiquettes : XSL; Quote JavaScript; Simple Quote; JavaScript; XSLT; SharePoint 2010; apostrophes