[AJAX] je comprends rien en ajax.. aucune alert ne fonctionne..
Bonjour je suis débutant et désespéré également, de ne pas parvenir à faire la moindre avec l'objet xmlhttprequest.......
J'ai tenté de faire un code simple pour commencer mais apparemment...
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type='text/javascript' language="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 test(){
var xhr=getXhr();
xhr.onreadystatechange=function(){
if(xhr.readyState==4 && xhr.status==200){
alert("ok");
else{
alert("erreur");}
}
}
</script>
</head>
<body>
<INPUT type="button" name="test" value="test" onclick='test()' />
...
</body></html> |
le principe d'ajax (Ascencronous javascript and xml)
Bonjour Marc et bienvenue sur le forum,
Puisque tu ne comprends pas beaucoup de choses en ajax, je vais t'expliquer :
Ajax est une technologie pour le chargement des données (images, textes, xml , document ...etc) sans actualiser la page. Je vais te donner un simple exemple pour commencer.
Premierment tu vois ce code html:
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
|
<html>
<head>
<script language="javascript" type="text/javascript" src="getXHR.js"></script>
<script language="javascript" type="text/javascript" src="ajax.js"></script>
</head>
<body>
<input type="text" id="username"><br>
<input type="text" id="password"><br>
<input type="button" id="ok">
<div id="resultat"></div>
</body>
</html> |
tu vois que j'ai pose dans la page html deux textbox pour entrer le username et le password, un bouton et un div pour afficher le resultat
les script importé dans le head sont des code de javascript Ajax
passant d'abord au code javascript pour la creation de l'objet xmlhttprequest
le fichier getXHR.js
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
|
function getXHR (){
var req=null;
try{
req=new XMLHttpRequest();
}
catch(err){
try{
req=new ActiveXObject("Microsoft.XMLHTTP");
}
catch(err2){
try{
req=new ActiveXObject("Msxml2.XMLHTTP");
}catch(err3){
alert("xmlhttprequest n'est pas disponible dans votre nav");
}
}
}
return req;
} |
ici je fais des testes avec try et catch , si le req est crée en tant que xmlhttprequest , c'est a dire qu'il s'agit d'un nav mozilla ... ou bien ie dans le cas de ActiveXObject.
le xmlHttprequest est un objet qui sert a envoyer une requete au code php ,qui va gérer la requete et va l'envoyer a l'utilisateur par xmlhttprequest... Maintenant c'est compris?
ensuite , vient le code suivant : (Ajax.js)
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
|
function getResponse(){
req=new getXHR();
req.onreadystatechange=function(){
if (req.readyState==4){
if (req.status==200){
document.getElementById("resultat").innerHTML=req.responseText;
}
}
else{
document.getElementById("resultat").innerHTML="Loading....";
}
}
var url="message.php?myuser="+document.getElementById("username").value+"&mypass="+document.getElementById("password").value;
req.open("GET",url,true);
req.send(null);
} |
puis le code php qui renvoie la reponse :
Code:
1
2
3
4
5
6
7
8
9
10
11
|
<?php
$username=$_GET['myuser'];
$password=$_GET['mypass'];
if ($username=='simo' & $password=='123'){
echo ("bonjour simo!");
}
else{
echo ("t'es anonyme, pas de bonjour!");
}
?> |
