Je veux bien faire une div sur la page (index.php) qui rappelle le contenu de (meteo.php) en passant le numéro de la ville (id_ville) par get (combobox ou lien directe) sans recharger ma page (index.php).
Je vous remercie pour votre aide.
Vous êtes demandeur d'emploi ? Sans diplôme post-bac ?
Si j'ai bien compris ta question, ce code (une fois adapté à ton cas) devrait te satisfaire :
function meteo(){
$.ajax({
type: "GET",
url: "maPageMeteo.php"
}).done(function(html){
$('#maDiv').html(html); // Retourne dans #maDiv le contenu de ta page
;
setTimeout("meteo();", 5000); // Va rafraichir les données toutes les 5 secondes
}
Créer : voilà la grande délivrance de la souffrance, voilà ce qui rend la vie légère.
Arnaud49 je te remercie 1000 fois, je vais essayer ton code..
Je suis peut être en avance mais toujours un petit blocage. J'ai pu m'inspirer d'un tutoriel et j'ai fais ce qui suit :
j'ai codé ma page (index.php) comme suit :
<?php
require("./connect.php");
?>
<html>
<head>
<title>Tutoriel Ajax (XHTML + JavaScript + XML)</title>
<script type='text/javascript'>
function getXhr(){
var xhr = null;
if(window.XMLHttpRequest) // Firefox et autres
xhr = new XMLHttpRequest();
else if(window.ActiveXObject){ // Internet Explorer
try {
xhr = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
}
else { // XMLHttpRequest non supporté par le navigateur
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
xhr = false;
}
return xhr;
}
function go(){
var xhr = getXhr();
// On défini ce qu'on va faire quand on aura la réponse
xhr.onreadystatechange = function(){
// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
if(xhr.readyState == 4 && xhr.status == 200){
leselect = xhr.responseText;
// On se sert de innerHTML pour rajouter les options a la liste
document.getElementById('id_meteo').innerHTML = leselect;
}
}
// Ici on va voir comment faire du post
xhr.open("POST","ajax_meteo.php",true);
// ne pas oublier ça pour le post
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
// ne pas oublier de poster les arguments
// ici, l'id de l'auteur
sel = document.getElementById('auteur');
id = sel.options[sel.selectedIndex].value;
xhr.send("id="+id);
}
</script>
</head>
<body>
<form>
<fieldset style="width: 500px">
<legend>METEO</legend>
<label>Ville : </label>
<select name='auteur' id='auteur' onchange='go()'>
<option value='-1'>Aucun</option>
<?php
$res = mysql_query('SELECT id_ville, ville FROM t_villes_meteo ORDER BY ville');
while($row = mysql_fetch_assoc($res))
{
echo "<option value='".$row["id_ville"]."'>".$row["ville"]."</option>";
}
?>
</select>
<br><br><br>
<div id='id_meteo'>
</div>
</fieldset>
</form>
</body>
</html>
sur une autre page appelée (ajax_meteo.php) j'ai fais ce code :
<?php
require("./connect.php");
$sql = "SELECT id_ville, ville FROM t_villes_meteo WHERE id_ville = ".$_POST["id"]." ";
$req = mysql_query($sql) or die(mysql_error());
$row = mysql_fetch_array($req);
$id_ville=$row['id_ville'];
$ville=$row['ville'];
?>
</br>
</br>
<!-- widget meteo -->
<div id="widget_e00fc18850d1b1e32a408b491a1dd1c3">
<a href="http://www.my-meteo.fr/previsions+meteo+maroc/<?php echo $ville ?>.html">Météo <?php echo $ville ?> 5 jours </a>
<script type="text/javascript">
(function() {
var my = document.createElement("script"); my.type = "text/javascript"; my.async = true;
my.src = "http://www.my-meteo.fr/meteo+webmaster/widget/js2.php?ville=<?php echo $id_ville ?>&format=classique&nb_jours=5&temps&c1=414141&c2=a1a1a1&c3=d4d4d4&c4=ffffff&c5=56d4f4&c6=d12e2e&police=0&t_icones=1&x=180&y=384&id=e00fc18850d1b1e32a408b491a1dd1c3";
var z = document.getElementsByTagName("script")[0]; z.parentNode.insertBefore(my, z);
})();
</script>
</div>
<!-- widget meteo -->
Mon idée est de passer la variable "id_ville" de ma ville de (index.php) en méthode poste vers (ajax_meteo.php) et essayer de rapporter le résultat de la page (ajax_meteo.php) dans la "div" de (index.php).
J'ai maintenant un problème que je ne comprend pas sur ma page index.php :
- Le titre dont le code dessous fonctionne très bien en changeant la ville
Après, concernant ton code honnêtement, j'ai pas la foi de tout lire. Cependant, de ce que j'ai pu en tirer comme conclusion c'est que tout ça est bien fouillis ! Essaye de voir des tutoriels concernant Ajax et Jquery et tu devrais pouvoir réaliser ce que tu souhaites (même si je reste convaincu que mon code précédent convient à ta situation!). Bon courage !
- Edité par arnaud49 1 septembre 2013 à 1:56:35
Créer : voilà la grande délivrance de la souffrance, voilà ce qui rend la vie légère.
Merci 1000 fois, je suis preneur de toute solutions... la votre se montre très intéressante et aussi très facile.
J'ai un problème quelque part. Est ce tu peux me vérifier où est l'erreur dans ton code ici.
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js">
function meteo(){
$.ajax({
type: "GET",
url: "maPageMeteo.php"
}).done(function(html){
$('#maDiv').html(html); // Retourne dans #maDiv le contenu de ta page
;
setTimeout("meteo();", 5000); // Va rafraichir les données toutes les 5 secondes
}
</script>
× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
× Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
Vous êtes demandeur d'emploi ?
Sans diplôme post-bac ?
Devenez Développeur web junior
Je postuleen ligne
à 100%