PROBLEME DE CHARGEMENT DE MON SCRIPT AVEC AJAX
Bonjour,
Je vous invite d'abors à visiter mon site www.pintagger.com ... J'ai un petit probleme avec ajax lors de la pagination en scroll. Lorsque on scroll vers le bas, ajax fais appel à une page PHP qui charge les statuts suivants au fur et à mesure. Voici mon script ajax situé dans index.ph
<div id="items"></div>var is_loading = false;
var limit = 4; // limit items par page
$(window).scroll(function() {
var scrollBottom = Math.floor($(window).scrollTop() + $(window).height());
var h=Math.floor($(document).height());
if(scrollBottom < h){
scrollBottom=scrollBottom+1
}else if(scrollBottom > h){
scrollBottom=scrollBottom-1
}
if(scrollBottom == h) {
var reup=-50;
$('#chargemnt').show();
$.ajax({
url: 'load_more.php',
type: 'POST',
data: {last_id:last_id, limit:limit},
success:function(data){
$('#chargemnt').hide();
$('#items').append(data);
is_loading = false;
}
});
}
});CE QUE JE VEUX
Lorsque ajax recupere le fichier PHP avec la methode append, ils perdent tous les fonctionnalités liées à un mes scripts integrés dans le header. Ce qui fais que on ne peut plus Liker ou Disliker les statuts. Pour cela j'ai du encore aller integrer tous mes scripts dans le fichier PHP load_more.php.... mais là encore ça generere d'autres problemes. Quant je click sur un bouton Like par exemple, c'est comme si j'avais clické 4 ou 5 fois ce bouton. Voilà, allez constatez vous même les degats. Est-ce que quequ'un peut me dire comment faire en sorte que le fichier PHP tienne compte de mes scripts dans le header?
11 réponses
Bonsoir,
je ne connais pas trop bind mais plus on en jquery.
j'ai eu le même problème, les éléments chargé en ajax n'appliquait pas les fonctions car appliquée sur les éléments au moment de l'appel.
Pour cibler les créations futures, au lieu de $(".dislike").on('click',(function t(){...})); il faut utiliser $(document).on('click',".dislike",(function t(){...}));
Ca permet d'appliquer tout les éléments de classe dislike dans le document même les futures créations.
bind ne prend pas de selecteur mais apparement il n'y a pas de diff avec on.
j'espère que ca pourra t'aider.
Bonsoir.
Pour commencer, dans ton fichier script.js, tu utilises jQuery, sauf que tu ne le charges pas auparavent.
Pour rappel, le fichiers et/ou codes javascript qui utilisent jQuery doivent être chargés après avoir chargé jQuery.
Donc pour exemple :
<!DOCTYPE html>
<html>
<head>
<!-- Chargement des metas -->
<title>...</title>
<!-- Chargement des fichiers/scripts CSS -->
</head>
<body>
<!-- Suite du code HTML -->
<!-- Chargement des fichiers/scripts javascripts n'utilisants pas jQuery -->
<!-- Chargement de jQuery -->
<!-- Chargement des fichiers javascripts/scripts utilisants jQuery -->
</body>
</html>Car là, rien que d'arriver sur la page d'accueil du site, il y a une quinzaine d'erreurs dans la console, entre celles de javascript et celles liées au chargement des CSS.
Donc si possible, essayez au moins de corriger un maximum d'erreurs se trouvant dans la console de l'inspecteur du navigateur.
@Lartak tu plaisantes ?
il y a du JQuery partout : au départ c'est du 1.12 puis l'ajax ramène du 3.1 et aussi du linkify-jquery.min.js
je n'ai jamais essayé ce genre de cocktail
@Antony_ tu joues au petit chimiste ?
Désolé, mais vu la structure du site, je passe mon chemin
@Huggy +1
De manière générale, ce n'est pas organisé, on sent qu'il ne sait pas trop (voir pas du tout) ce qu'il fait. Tout est chargé à l'arrache dans le head. Il y a un ENORME travail de réorganisation et de structuration à faire là.
@Lartak, linkify-jquery.min.js est un framework Js qui sert rien de plus qu'à mettre des liens hypertext en surbrillance, il n'a aucun conflit avec Jquery. Pourtant j'ai expliqué plus haut que j'etais obligé de reinjecter les balises de mon head dans le fichier PHP pour que les evenements Jquery fonctionnent. Si j'enleve ça, plus rien ne marche! D'où ma question de savoir comment faire pour que le fichier PHP appellé par ajax tienne compte du Jquery dans head.
ps: Merci pour vos remarquent car j'y tient compte:)
Le problème c'est que c'est au chargement, que les éléments sont ciblé par ton JS/JQuery et si tu charge dynamiquement des éléments Js ne les prends pas en compte !
Il faut peut-être recharger le script une fois les éléments affichés mais sans injecter de nouveau ton script !
@Jerremi, comment faire pour recharger le script à nouveau? C'est justement ce que je cherche.
Bonsoir.
@ Huggy : Pourquoi tu me demandes si je plaisantes ?
Je n'ai fait que lui expliquer l'importance de l'ordre de chargement au niveau javascript, pour qu'il comprenne qu'il doit d'abord charger jQuery avant de l'utiliser, ce qui n'est pas le cas actuellement.
Jquery est chargé dans mon header
Tu charges le fichier script.js qui utilise jQuery avant de charger jQuery, ce qui d'après l'explication que je t'ai donné, est incorrect.
Si tu ne peux pas comprendre ça, je vois mal comment nous pourrons t'aider.