Visualforce + jQuery

Question

J'essaie d'implémenter un plugin de galerie jQuery dans un site Force.com. J'ai téléchargé un fichier zip contenant tous les fichiers requis comme ressource statique.

Je fais référence aux feuilles de style et au javascript comme ci-dessous:

<apex:includeScript value="{!URLFOR($Resource.jqueryadgallery, 'jquerygallery/jquery.ad-gallery.js')}" />
<apex:stylesheet value="{!URLFOR($Resource.jqueryadgallery, 'jquerygallery/jquery.ad-gallery.css')}"/>

Cela fonctionne et j'obtiens le CSS associé pour le plugin (vérifiez-le ici - http://coffeescripter.com/code/ad-gallery/). Mais la seule partie qui fonctionne est que les miniatures d'image sont affichées avec la bordure d'image définie dans le fichier CSS. Vous pouvez voir ce que j'ai fait ici - http://fusev-developer-edition.ap1.force.com/imagedemo. J'ai suivi la documentation mais il me semble que le JavaScript ne fonctionne pas.

Toute aide appréciée, applaudie

Answer 1

Voici quelques éléments à vérifier:

• Salesforce utilise Prototype.js, qui, comme jQuery, utilise la variable globale $. Il vaut toujours mieux faire quelque chose comme $j = jQuery.noConflict(); En haut de votre script afin d'empêcher JQuery de cliqueter le prototype. Vous devrez également modifier tout votre javascript à utiliser $j à la place de $ pour jQuery Stuff.

• Il semble que votre script de plugin jQuery se charge avant JQuery lui-même. Assurez-vous que votre premier apex:includeScript charge jQuery.

• Mon navigateur rapporte une erreur de syntaxe dans votre page VF:

Answer 2

<apex:includeScript value="{!URLFOR($Resource.jquery, '/jquery/external/jquery/jquery.js')}"/>
<apex:includeScript value="{!URLFOR($Resource.jquery, '/jquery/jquery-ui.min.js')}"/>

<script>
    j$ = jQuery.noConflict();
    if(j$){
        alert('Success');
    }else{
        alert('Failure');
    }
</script>