Page 1 sur 1
faire de l'ajax avec jquery ?
Posté : 24 mars 2009, 17:30
par x@v
Bonjour,
j'ai un menu et je voudrai insérer un bout de code dans la balise #contenuPage
L'alerte fonctionne bien, mais comment insérer la page accueil.php dans #contenuPage ?
Code : Tout sélectionner
$('ul#menu li a img').click( function() {
$.ajax({
type: "GET",
url: "accueil.php",
cache: false,
data: "name=John&location=Boston",
success: function(t){
alert( "Data Saved: " + t);
//$("#contenuPage").append(responseText);
}
});
});
Merci
Posté : 24 mars 2009, 18:10
par julian
En faisant
$("#contenuPage").html(t);
?
Posté : 24 mars 2009, 18:27
par x@v
oui j'ai aussi ajouter un return false pour annuler le click, et sa fonctionne.
Par contre comment passe t-ont habituellement une valeur en get ?
Posté : 24 mars 2009, 18:37
par julian
Dans les paramètre de ton ajax, tu as
type: "GET",
url: "accueil.php",
data: "name=John&location=Boston",
ce qui équivaut à un appel comme ceci : accueil.php?name=John&location=Boston
En gros, dans le type, tu spécifie le type de passage de paramètres (généralement GET ou POST)
Ensuite tu liste tes paramètres dans data comme si tu les passait à l'url, sauf que c'est jquery qui s'occupe de les envoyer selon le type défini.
Posté : 24 mars 2009, 18:45
par x@v
oui en faite je parlais de récupérer les parmètres de get pour les passer à la requetes :
Code : Tout sélectionner
$('ul#menu li a img').click( function() {
var t=$(this).attr("id");
$("#contenuPage").fadeTo(500, 0);
$.ajax({
type: "GET",
url: "accueil.php",
cache: false,
data: "page="+t,
success: function(t){
$("#contenuPage")
.stop()
.fadeTo(1500, 1)
.html(t);
}
});
return false;
});
je récupère l'id du lien cliquer et je le pase en parmèrtre
Code : Tout sélectionner
<ul id="menu">
<li>
<a href="?page=1" title="lien1">
<span class="lienTexte">page 1</span>
<img src="img/bouton1.png" alt="image absente" class="boutonImage" id="1" />
</a>
</li>
<li>
<a href="?page=2" title="lien1">
<span class="lienTexte">page 2</span>
<img src="img/bouton1.png" alt="image absente" class="boutonImage" id="2" />
</a>
</li>
<li>
<a href="?page=3" title="lien1">
<span class="lienTexte">page 3</span>
<img src="img/bouton1.png" alt="image absente" class="boutonImage" id="3" />
</a>
</li>
<li>
<a href="?page=4" title="lien1">
<span class="lienTexte">page 4</span>
<img src="img/bouton1.png" alt="image absente" class="boutonImage" id="4" />
</a>
</li>
</ul>, ce qui fonctionne mais bon, ça m'oblige à marqué des id dans mes images, dans ce contecxte pas très élégants :
var t=$(this).attr("id");
Posté : 24 mars 2009, 18:54
par julian
De mémoire tu dois pouvoir faire un this.url en JS pour récupérer la chaine de l'attribut href quand tu as cliquer sur un lien.
par contre il faudrait que tu sois dans la fonction click de la balise a
$('ul#menu li a').click( function() {
//...
}
Posté : 24 mars 2009, 19:23
par x@v
comme cela ?
Code : Tout sélectionner
$('ul#menu li a').click( function() {
//var t=$(this).attr("id");
var t=$(this).attr();
console.log(t);
ça ne me renvoir rien ?
edit:
autant pour moi
var t=$(this).attr('href');
mais cela me renvoie :
?page=1
Faut en suite faire un traitement sur la chaine...
Mais bon il n'y a pas plus dynamique ?
Posté : 24 mars 2009, 19:57
par julian
Euh non...
C'est juste un Split() là qu'il faut faire !
Posté : 25 mars 2009, 01:49
par x@v
j'ai du placer des id dans les liens, mais c'est pas valide d'avoir des nombres ?
http://www.6tnline.com/serge/introduction.php
Posté : 25 mars 2009, 09:21
par julian
Code : Tout sélectionner
var url = this.url.Split("="); // On coupe la chaine au niveau du =
var id = url[1]; // On récupère la seconde partie du tableau résultat
Posté : 25 mars 2009, 13:13
par x@v
Dans la page php :
substr('?page=tonId', 6); cela me renverra "monId"
j'ai vachement de mal avec le javascript, ont ne peux même pas connaître le protoype de la méthode spilt() ?
Posté : 25 mars 2009, 13:16
par julian
ont ne peux même pas connaître le protoype de la méthode spilt() ?
Un petit coup de Google et :
http://www.toutjavascript.com/reference ... hp?iref=45
Posté : 25 mars 2009, 13:30
par x@v
j'ai ajouter ma contribution, hihi
http://docs.jquery.com/Split