JQuery dans un template

[gesualda]

Bonjour,

Je suis entrain de construire mon propre template. Pas de soucis particulier en CSS.

Ne connaissant absolument rien au jquery, j'ai vu qu'une version est chargé d'office dans le template par "head".

<jdoc:include type="head" />

[FONT=monospace]<script src="[URL="http://joomla35st/media/jui/js/jquery.min.js"]/media/jui/js/jquery.min.js[/URL]">[/FONT][FONT=monospace]</script>[/FONT]

Ce que je souhaiterai faire :
- Contrôler si jquery est déjà chargé, ne plus le recharger.
- Charger la dernière version soit en ligne, soit dans un dossier en place de la version minimum

<script type="text/javascript" src="[URL]https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js[/URL]"></script>

<script type="text/javascript" src="/js/jquery.js"></script>

Merci

[gesualda]

Re : JQuery dans un template

J'ai trouvé ce bout de code, mais il ne fonctionne pas ( enfin chez moi )

if (typeof jQuery == 'undefined') {
   var script = document.createElement('script');
   script.src = 'src=http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js';
   script.type = 'text/javascript';
   document.getElementsByTagName('head')[0].appendChild(script);
}

Si j'appelle jquery directement, pas de soucis

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

[gesualda]

Re : JQuery dans un template

Je vais formuler différemment.
Lorsque je veux rajouter un script pour tester dans ex => protostar ou bien tmp perso, le script ne fonctionne pas.

Exemple d'un test rajouter juste avant la balise </head>

<script type="text/javascript">
	$(document).ready(function() {
  		$("h5").text("Le texte est chargé dans la balise...");
			});
</script>

Dans le body de l'index du template => <h5></h5>

J'ai testé, le jsquery est bien chargé en amont, mais ne donne pas de résultat.

Voila, je rappelle que je ne connais quasi rien en JS. SI je pouvais avoir un conseil pour faire fonctionner un bout de code jquery, je suis preneur.

Merci d'avance

[ghazal]

Re : JQuery dans un template

Salut,
jQuery est *toujours* chargé par défaut en front, via :
<jdoc:include type="head" />
comme tu le définis plus haut.

* Joomla charge la version minifiée (compressée).
Elle se trouve ici :
/media/jui/js/jquery.min.js

La dernière version utilisée par joomla est la 1.11.3
La dernière version officielle de la série 1.x est la 1.12.2.
Tu peux toujours remplacer celle de joomla par la version plus récente de cette série.

* pour ton code
Utilise la méthode joomla et encapsule ton code avec ceci :

<script type="text/javascript">
jQuery(function($){
$(document).ready(function() {
// code ici


});

});
</script>

Maintenant, le JS en général est très contraint au niveau des ; et des ( et ) ou { et }
Le moindre oubli fait planter le code. Ton exemple :

jQuery(function($){
$(document).ready(function() {
// code ici
$("h5").text("Le texte est chargé dans la balise...");

});

});

Pour le reste, je te renvoie sur mon article sur le JS et joomla :
Tutoriel Joomla et l'inclusion de JavaScript - Cinnk magazine
-> http://cinnk.com/magazine/aout-2015/...-de-javascript
Et si tu as des questions ... n'hésite pas.

[gesualda]

Re : JQuery dans un template

Tout d'abord Ghazal, merci de m'avoir porté quelques éclaircissements. En effet, je comprends bien les contraintes de fermeture des balises, qui d'ailleurs sont également dans php.

Comme dit, je suis très apprenti en JS(Jquery), donc j'essayai de comprendre pourquoi jquery chargé dans le head de joomla, je n'arrivai pas à afficher le résultat du code.
Juste une question : dans joomla faut-il systématiquement utiliser cette méthode d'encapsulage pour y introduire un morceau de code ?

J'ai vu également la version 2.2.2 de Jquery. celle ci est-elle utilisable dans joomla 3.5 et/ou es ce une version améliorée de la version 1 ?

Pardon de ces questions simplistes. En tous les cas, je vais pouvoir continuer mes travaux. Merci encore pour la lecture de ton article. Très intéressant.

[ghazal]

Re : JQuery dans un template

Juste une question : dans joomla faut-il systématiquement utiliser cette méthode d'encapsulage pour y introduire un morceau de code ?

Cet encapsulage, dont l'histoire et la nécessité remontent à la présence de mootols (l'autre js framework utilisé dans les anciennes versions de joomla), permet, entre autres, de régler le pb de l'ambiguité du $ et d'envelopper le script dans une fonction gérable par jQuery.
Autrement tu te récupères une erreur genre : TypeError: $ is not a function

J'ai vu également la version 2.2.2 de Jquery. celle ci est-elle utilisable dans joomla 3.5 et/ou es ce une version améliorée de la version 1 ?

A priori, tout fonctionne. Je fais régulièrement des tests avec l'une ou l'autre version. Mais hors joomla.
Bien que les choses se régularisent, il arrive que les développeurs d'extensions incluent du code JS pas super clean. C'est plutôt là qu'il faut être prudent.

Ca t'intéresserait de tester un ... package (je ne trouve comment le nommer autrement) que j'ai concocté pour améliorer l'affichage des résultats de com_search (en override) avec les fichiers JS et CSS correctement placés dans le dossier "media" ?

[gesualda]

Re : JQuery dans un template

Merci pour cette réponse. Bien sur pas de soucis le test !

[ghazal]

Re : JQuery dans un template

OK, j'envoie ça dans la journée.