JQuery est en conflit avec Primefaces? [dupliquer]

cette question a déjà une réponse ici:

j'ai inclus JQuery1.5 dans l'en-tête d'une page JSF. Dans cette page, il y a un tas de Primefaces déjà codés. Après Je ont inclus le Jquery.js dans l'en-tête de la page, certains primefaces composants comme <p:commandButton> perd leur peau et <p:fileUpload> devient ressembler à la normale JSP <input type="file"> et perdre sa capacité AJAX entièrement.

y a-t-il un moyen d'utiliser jQuery en toute sécurité avec les primefaces(sans conflit)?

34
demandé sur xpda 2011-03-28 13:52:00

7 réponses

j'ai eu le même problème que décrit dans la question. C'est pourquoi j'ai trouvé la solution suivante:

Comprennent les primefaces intégré dans la bibliothèque jQuery (actuellement 1.4.1), y compris une bibliothèque jQuery conduit à des problèmes de mise en forme CSS. L'ajout de l'attribut target="head" permet de spécifier la balise partout - par exemple lors de l'utilisation de templating vous n'avez pas toujours accès à la balise <head> : 

<h:outputScript library="primefaces" name="jquery/jquery.js" target="head" />

les primefaces la bibliothèque jQuery est incluse par défaut en mode conflit. Cela signifie que le raccourci $() ne peut pas être utilisé. Pour résoudre ce problème, inclure la ligne suivante dans une étiquette <script> ou <h:outputScript> : 

<h:outputScript target="head">
    // Add the $() function
    $ = jQuery;
    // Now you can use it
    $(document).ready(function() {
        ...
    });
</h:outputScript>

C'est la meilleure solution que j'ai pu trouver jusqu'à présent, en utilisant primefaces 2.2.1.

50
répondu Lars Blumberg 2013-02-12 13:20:47

pourquoi ne pas utiliser les faisceaux jquery avec des PrimeFaces? 

<h:outputScript library="primefaces" name="jquery/jquery.js" />

PrimeFaces 2.2.1 a jQuery 1.4.4 et 3.0(en développement) a 1.5.1.

43
répondu Cagatay Civici 2012-01-24 23:01:57

de nombreuses bibliothèques JavaScript utilisent $ comme fonction ou nom de variable, tout comme jQuery. Dans le cas de jQuery, $ est juste un alias pour jQuery , donc toutes les fonctionnalités sont disponibles sans utiliser $ . voici quelques méthodes:

  • Write jQuery.noConflict(); avant l'initialisation de jQuery,voir ci-dessous 

    jQuery.noConflict();
$(document).ready(function(){
   // your jQuery code   
});

  • créer un alias différent au lieu de jQuery à utiliser dans le reste du script. 

     var j = jQuery.noConflict();
 // Do something with jQuery
 j("div p").hide();

  • changer toutes les instances de $ : remplacer $ par jQuery dans le bloc de code jQuery 

     jQuery(document).ready(function){
       jQuery("div p").hide();
 })

  • déplacez complètement jQuery vers un nouvel espace de nom dans un autre objet. 

    var dom = {};
dom.query = jQuery.noConflict(true);
// Do something with the new jQuery
dom.query("div p").hide();

  • Définir la portée de la $ pour locale à la place de mondial 

        // Method 1
    jQuery(document).ready(function($){
         $("div").hide();
    });


    // Method 2
    (function($) {
      /* some code that uses $ */ 
    })(jQuery);

    Note: ce point a un inconvénient, Vous n'aurez pas accès à la méthode $ () de votre autre bibliothèque.

Original Reference

6
répondu diEcho 2013-01-11 08:37:18

ma solution est d'ajouter ce code dans la page par défaut: 

<script type="text/javascript">var $j = jQuery.noConflict(true);</script>

après cela j'utilise jquery avec: 

$j

Merci,

6
répondu Marin 2018-02-12 14:29:18

jQuery a un ' noConflict ' mode qui lui permet de jouer gentiment côte à côte avec d'autres bibliothèques. Je n'ai pas utilisé les composants de Primefaces, donc je ne suis pas sûr, mais si vous incluez jQuery en mode noconflict, vos problèmes disparaîtront probablement.

3
répondu MightyE 2011-03-28 09:57:32

mon expérience:

j'ai eu le même problème et je ne l'ai jamais fait travailler avec les deux libs jquery. (J'utilise jQuery au lieu de $ mais je n'ai jamais essayé jQuery.noConflict() ).

ma solution a été d'utiliser seulement le lib livré avec des primefaces comme décrit dans Cagatays réponse.

3
répondu Matt Handy 2011-03-28 10:10:39

pour résoudre le conflit entre Primefaces et jQuery éviter d'importer tout fichier jquery externe, donc pour résoudre le problème importer les fichiers jQuery situés dans le pot primefaces 

<h:outputScript library="primefaces" name="jquery/jquery.js" target="head" />
        <h:outputScript library="primefaces" name="jquery/jquery-plugins.js" target="head" />

et dans votre code jQuery remplacer le $ par jQuery.

1
répondu Hamza Toussi 2016-03-04 17:02:43