J'ai inclus JQuery1.5 dans l'en-tête d'une page JSF. Dans cette page, il y a un tas de composants Primefaces déjà codés. Après avoir inclus les Jquery.js dans l'en-tête de la page, certains composants de primefaces tels que <p:commandButton> perdent leur apparence et <p:fileUpload> devient semblable à un JSP normal <input type="file"> et perdre totalement sa capacité AJAX.
Existe-t-il un moyen d'utiliser JQuery en toute sécurité avec primefaces (sans conflit)?
J'ai eu le même problème que décrit dans la question. C'est pourquoi je suis venu avec la solution suivante:
Inclure le primefaces intégré dans la bibliothèque jQuery (actuellement 1.4.1) comme incluant une bibliothèque jQuery conduit à des problèmes de mise en forme CSS. L'ajout de l' target="head" attribut permet de spécifier la balise partout - par exemple lors de l'utilisation de template vous ont pas toujours accès à l' <head> balise:
<h:outputScript library="primefaces" name="jquery/jquery.js" target="head" />
Le primefaces bibliothèque jQuery est inclus par défaut dans le conflit mode. Cela signifie que l' $() de raccourci ne peut pas être utilisé. Pour surmonter ce problème inclure la ligne suivante dans un <script> ou <h:outputScript> balise:
<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 creuser jusqu'à présent, à l'aide de primefaces 2.2.1.
Beaucoup de bibliothèques JavaScript utiliser $ comme une fonction ou un nom de variable, tout comme le fait jQuery. JQuery dans le cas d'espèce, $ est qu'un alias de jQuery, de sorte que toutes les fonctions sont disponibles sans l'aide de $ . suivants sont quelques méthodes :
Écrire 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 pour utiliser dans le reste du script.
var j = jQuery.noConflict();
// Do something with jQuery
j("div p").hide();
Changer toutes les instance de $ : Remplacer $ avec jQuery jQuery dans le bloc de code
jQuery(document).ready(function){
jQuery("div p").hide();
})
Complètement déplacer jQuery pour un nouvel espace de noms d'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 $ locale au lieu de mondial
// Method 1
jQuery(document).ready(function($){
$("div").hide();
});
// Method 2
(function($) {
/* some code that uses $ */
})(jQuery);
Remarque : ce point est livré avec un inconvénient, vous n'aurez pas accès à votre bibliothèque de $() méthode.
jQuery a un mode ' noConflict ' qui lui permet de bien jouer côte à côte avec d'autres bibliothèques. Je n'ai pas utilisé de composants Primefaces, donc je ne le sais pas avec certitude, mais si vous incluez jQuery en mode simplifié, vos problèmes disparaîtront probablement.
Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.
