aide transformation ajax -> mootools

Version imprimable

bonjour,

j'ai utilise la bibliotheque mootools et un de ces addons pour creer un menu.

et je me disais que c'etait le moment que je transforme mes scripts classiques ajax avec mootools.

voila un exemple de script que j'utilise:

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
 
	//fonction qui cree un element XMLHttpRequest
	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 afficheInfosLogin(){
		var login = document.getElementById('loginEnBase');
		login2 = login.options[login.selectedIndex].value;
		var xhr = getXhr();
		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){
				rep = xhr.responseText;
				document.getElementById('afficheLogin').innerHTML = rep;
			}
		}
		xhr.open("POST","traitement/afficheLogin.php",true);
		xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
		xhr.setRequestHeader('Cache-Control','no-cache');
		xhr.send("login="+login2);
	}

la div ou j'affiche le contenu :

Code:

<div id='tabconfig' style='display:inline'></div>

si j'ai oublie de preciser des infos n'hesiter pas me le dire.

mais voila est ce que quelqu'un pourrait me montrer comment faire ?

merci beaucoup ;)

15/09/2009, 11h10
fey

personne n'a une idee comment je peux faire ?

bonjour,

j'ai bricole cela, visiblement cela fait ce que je voulais.
est ce que la syntaxe est bonne ?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 
	//affiche les infos liees au login selectionne
	function afficheInfosLogin(){
	     $('loginEnBase').getElements('option').addEvent('click', function(){
 
			var login = document.getElementById('loginEnBase');
			login2 = login.options[login.selectedIndex].value;
 
	         var xhr = new Request({ method: 'post', url : './traitement/afficheLogin.php',
 
	             onComplete: function(){
	                 var rep = xhr.response.text;
	                 $('afficheLogin').innerHTML = rep;
	             }
	         }).send("login="+login2);
	     });
	}
	window.addEvent("domready", function() { 
		afficheInfosLogin();
	});

sinon pour ces deux infos elles sont gerees comment par mootools ?

Code:

1
2
 
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');

Code:

1
2
 
xhr.setRequestHeader('Cache-Control','no-cache');

merci beaucoup
fey

salut!

Y a quelque truc a revoir!

exemple tu fait:

Code:

1
2
3
4
5
6
 
 
onComplete: function(){
	                 var rep = xhr.response.text;
	                 $('afficheLogin').innerHTML = rep;
	             }

alors que ceci est plus correct à mon sens:

Code:

1
2
3
4
 
onComplete: function(reponse){
	                $('afficheLogin')set('html', reponse);
	             }

Après je dit peut étre des connerie car je suis pas un expert JS et mootools ^^

01/10/2009, 19h18
fey
slt,
cela ne fonctionne pas ^^

il met :
Code:

1 2 3 missing ; before statement [Break on this error] $('afficheLogin')set('html', reponse);\n
sinon c'est vrai sur le principe cela avait l'air mieux ;)