Créer un Processus "Smart View" via un modèle

Pourquoi et quand exécuter cette tâche

Un Processus "Smart View" utilise une étape XSLT pour refléter la présentation HTML de l'enregistrement XML entrant. La chose la plus simple à faire est de créer un modèle HTML avec des valeurs codées en dur hors du Studio Talend :

<tr>
<td>Product Name</td><td>PROD NAME</td>
<!-- etc -->
</tr>

Copiez-collez ensuite ce modèle dans le corps de la feuille de style XSLT dans l'éditeur du Processus, et remplacez la valeur codée en dur par les instructions <xsl:value-of> :

<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
version="1.0">  
    <xsl:output method="html" indent="yes"/>  
    <xsl:template match="/" priority="1"> 
        <html> 
            <head> 
                <title>Product</title> 
            </head>  
            <body> 
<tr>
<td>Product Name</td><td><xsl:value-of select="Product/Name"/></td>
<!-- etc -->
</tr>
            </body> 
        </html> 
   </xsl:template> 
</xsl:stylesheet>

Utilisez par exemple PHPform (uniquement en anglais) pour créer un modèle Web de votre formulaire. Un modèle Web se compose d'un ou plusieurs fichier(s) HTML en plus des ressources (JavaScript, CSS, images, etc.). Les ressources doivent être accessibles depuis MDM donc vous devez les placer dans <TomcatPath>/webapps/, où <TomcatPath> désigne le chemin où a été installé Tomcat.

Procédure

Dans <TomcatPath>/webapps/, créez un nouveau dossier nommé smartview, dézippez le modèle Web dans un autre dossier nommé Product (c'est-à-dire dans <TomcatPath>/webapps/smartview/Product/).

Votre formulaire doit maintenant être accessible via : http://localhost:8180/smartview/Product/form.html.
Ouvrez le formulaire dans un éditeur de texte et vérifiez les éléments HTML.
Le XSLT est du XML, et le XML est plus strict que le HTML. Vous pouvez voir des tags de début sans tags de fin (meta, img, link, etc.). Vérifiez que tous les éléments HTML sont écrits avec un tag de début et un tag de fin.
Corrigez l'URL de JS, CSS et des images. Changez tous les attributs src afin qu'ils pointent vers /smartview/Product/<resource> au lieu de simplement <resource>. Par exemple :
Changez :
```
<script type="text/javascript" src="view.js"></script>
```
en : <script type="text/javascript" src="/smartview/Product/view.js"></script>
Créez un Processus "Smart View" dans le Studio Talend comme décrit dans Créer une "Smart View" par défaut d'un enregistrement de données et nommez-le Smart_view_Product.
Changez <xsl:template match="/"> en <xsl:template match="/Product">, si l'entité est Product.
Copiez le code HTML, sans <!DOCTYPE>, à partir du tag HTML et collez-le dans l'élément <xsl:template match="/Product">. Écrasez tout ce qui était à l'intérieur de l'élément <xsl:template> :
Paramétrez les valeurs des champs avec les valeurs avec les valeurs actuelles extraites de l'enregistrement Product à l'aide de l'instruction <xsl:value-of>. Pour demander au XSLT d'écrire un attribut, utilisez l'instruction <xsl:attribute>.

Résultats

Voici, par exemple, le code HTML avant le changement :

<label class="description" for="element_2">Price
</label>
<div>
    <input id="element_2" name="element_2" class="element text   medium" type="text" maxlength="255" value=""/>
</div>

Après le changement :

<label class="description" for="element_2">Price
</label>
<div>
    <input id="element_2" name="element_2" class="element text medium" type="text" maxlength="255">
<xsl:attribute name="value"><xsl:value-of select="Price"/></xsl:attribute>
    </input>
</div>

Cela dit au XSLT d'émettre un attribut "value" dans le tag <input> et de récupérer la valeur de cet attribut depuis l'élément Price de l'enregistrement Product.

Cette page vous a-t-elle aidé ?

Si vous rencontrez des problèmes sur cette page ou dans son contenu – une faute de frappe, une étape manquante ou une erreur technique – faites-le-nous savoir.

Laissez vos commentaires ici