Rechargement de page en Ajax. Mais en double
Darius
-
Nic0- Messages postés 341 Date d'inscription Statut Membre Dernière intervention -
Nic0- Messages postés 341 Date d'inscription Statut Membre Dernière intervention -
Bonsoir à tous !
Je suis en train de suivre un tutoriel pour actualiser le contenu de mes pages en AJAX, donc le contenu de la div : contenu justement.
Le soucis c'est que ça me charge ma page deux fois,
C'est à dire, que j'ai deux vois le header, et deux fois le footer !
Mes pages sont au format : index.php?page=inscription
// Vérifie que la page est bien chargée
$(document).ready(function(){
$("#footer a").click(function() {
// Variable avec l'url de la page
page=($(this).attr("href"));
// On fait une requête ajax
$.ajax ({
url : page,
cache: false,
success:function(html){
afficher(html);
},
error:function(XMLHttpRequest,textStatus, errorThrown) {
alert(textStatus);
}
})
return false;
});
});
// Fonction qui va permettre d'afficher le contenu
function afficher(data){
// On veut vider le contenu d'une div
$("#contenu").empty();
// On va afficher le nouveau contenu
$("#contenu").append(data);
}
Ou est le probleme ?
Merci à tous !
Je suis en train de suivre un tutoriel pour actualiser le contenu de mes pages en AJAX, donc le contenu de la div : contenu justement.
Le soucis c'est que ça me charge ma page deux fois,
C'est à dire, que j'ai deux vois le header, et deux fois le footer !
Mes pages sont au format : index.php?page=inscription
// Vérifie que la page est bien chargée
$(document).ready(function(){
$("#footer a").click(function() {
// Variable avec l'url de la page
page=($(this).attr("href"));
// On fait une requête ajax
$.ajax ({
url : page,
cache: false,
success:function(html){
afficher(html);
},
error:function(XMLHttpRequest,textStatus, errorThrown) {
alert(textStatus);
}
})
return false;
});
});
// Fonction qui va permettre d'afficher le contenu
function afficher(data){
// On veut vider le contenu d'une div
$("#contenu").empty();
// On va afficher le nouveau contenu
$("#contenu").append(data);
}
Ou est le probleme ?
Merci à tous !
A voir également:
- Rechargement de page en Ajax. Mais en double
- Double ecran - Guide
- Whatsapp double sim - Guide
- Impossible de supprimer une page word - Guide
- Mettre google en page d'accueil - Guide
- Double driver - Télécharger - Pilotes & Matériel
9 réponses
Salut,
Je suis pas trop spécialiste, mais,
Tu passes ta page complète en argument : « afficher(html); »
Puis tu enlèves une partie, « $("#contenu").empty(); »
Puis, tu rajoute à la suite de la div contenu, la totalité de ta page. « $("#contenu").append(data); »
Donc ton résultat est logique oui, il faudrait je pense ne passer en argument que le contenu et non toute la page, (afficher();)
Ou au contraire, au lieu de n'effacer que #contenu, effacer toute ta page, mais je pense que niveau ressource c'est moins performant.
Ça devrait te donner des pistes à creuser. Désolé j'en sais pas forcément plus.
Je suis pas trop spécialiste, mais,
Tu passes ta page complète en argument : « afficher(html); »
Puis tu enlèves une partie, « $("#contenu").empty(); »
Puis, tu rajoute à la suite de la div contenu, la totalité de ta page. « $("#contenu").append(data); »
Donc ton résultat est logique oui, il faudrait je pense ne passer en argument que le contenu et non toute la page, (afficher();)
Ou au contraire, au lieu de n'effacer que #contenu, effacer toute ta page, mais je pense que niveau ressource c'est moins performant.
Ça devrait te donner des pistes à creuser. Désolé j'en sais pas forcément plus.
Oui mais le soucis c'est que c'est ce qu'ils disent de faire ici :
http://top-news.fr/ajax-avec-jquery-exemple-changement-du-contenu-d-un-div/
http://top-news.fr/ajax-avec-jquery-exemple-changement-du-contenu-d-un-div/
J'ai regardé vite fait, si tu click directement sur les liens corrrespondant, tu tombes sur une page uniquement avec le contenu, en gros il n'y a pas de header sans sa page, il ne se soucis pas à parser le résultat donc.
Exemple: http://top-news.fr/demos/ajax-jquery/contenu2.html
Exemple: http://top-news.fr/demos/ajax-jquery/contenu2.html
Regarde peut être de ce côté là pour ne sélectionner que la partie contenu de ta page :
https://api.jquery.com/id-selector/
https://api.jquery.com/id-selector/
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
J'ai essayé en mettant
var test = document.getElementById("contenu") ainsi qu'une alert quand je clique sur un lien ça affiche :
[Object HTMLDivElement]
var test = document.getElementById("contenu") ainsi qu'une alert quand je clique sur un lien ça affiche :
[Object HTMLDivElement]
Il utilise cette fonction pour la requete ajax, dans son exemple :
https://api.jquery.com/jQuery.ajax/
Ça devrait te donner des pistes.
Le fait que les pages soit en html ou php n'auras pas d'influence sur le résultat.
https://api.jquery.com/jQuery.ajax/
Ça devrait te donner des pistes.
Le fait que les pages soit en html ou php n'auras pas d'influence sur le résultat.
context:
This object will be made the context of all Ajax-related callbacks. For example specifying a DOM element as the context will make that the context for the complete callback of a request, like so:
This object will be made the context of all Ajax-related callbacks. For example specifying a DOM element as the context will make that the context for the complete callback of a request, like so:
$.ajax({ url: "test.html", context: document.body, success: function(){
$(this).addClass("done");
}});