11548 sujets

JavaScript, DOM et API Web HTML5

[Jquery] Recuperer une variable avec la fonction $.ajax

Bonjour,

Je souhaite récupéré du côté client le contenu d'un fichier xml. Pour cela j'utilise $.AJAX qui récupère les données du xml dans un tableau. Ce tableau étant déclaré comme une variable globale en amont de mon fichier JS.

Voici le code source de ma fonction :

function inputDefault() {
	defaultVal = Array();
	$.ajax({
        type: "GET",
        url: "../autoEmpty.xml",
        dataType: "xml",
        success: function(xml) {
			$(xml).find('value').each(function() {
				defaultVal[''+$(this).find('for').text()+''] = $(this).find('default').text();
			});
       	}
    });
    alert(defaultVal['facebook']);
}


Lorsque je fais un alert de mon tableau avec la clé "facebook", j'ai le droit à un joli "undefined".

J'ai fait ce même alert dans la fonction succes et ca fonctionne bien.

Donc la variable global n'est pas pris en compte dans la fonction succes...

Ma question est la suivante :
Comment puis-je récupérer ce tableau dans une variable global ?
ton code tel que tu l'as mis lance la requete AJAX et fais un alert de ta variable. Puis lorsque le XML arrive, la fonction anonyme que tu as mis dans success est lancée, avec la variable correctement à jour.

Il n'y a pas moyen de faire autrement, c'est du XHR (XmlHttpRequest dit AJAX). C'est donc à la fonction anonyme que tu mets dans success de faire quelque chose de ta variable, comme la donner à une autre fonction par exemple

dernière remarque qui t'aidera dans tous tes devs JS : pour déclarer une variable dans un certain scope, il faut mettre var machin;
ça évite de polluer l'espace global, tu peux aller voir mon article sur le développement en JS orienté objet, ça parle entre autre du scope : http://jpv.typepad.com/blog/2010/03/javascript-orient%C3%A9-objet-syntaxe-de-base-des-classes.html
C'est normal, car les données seront accessible qu'une fois l'ajax terminé.
L'alert se produit avant que l'ajax soit finis d'ou le undefined.

Il faut faire joujou avec bind / trigger ou exécuter le code directement dans le callback 'success'.
Merci pour votre aide,

J'ai tout simplement passé ma requête Ajax en mode synchrone, ca fonctionne bien mais je sais pas si c'est la meilleur solution.

Voici la source :
function inputDefault() {
	var defaultVal = Array();
	$.ajax({
        type: "GET",
        url: "../autoEmpty.xml",
        dataType: "xml",
        async : false,
        success: function(xml) {
			$(xml).find('value').each(function() {
				defaultVal[''+$(this).find('for').text()+''] = $(this).find('default').text();
			});
       	}
    });
    alert(defaultVal['facebook']);
}

Modifié par ggouhier (26 May 2010 - 15:45)
ggouhier a écrit :
Bonjour,

Je souhaite récupéré du côté client le contenu d'un fichier xml. Pour cela j'utilise $.AJAX qui récupère les données du xml dans un tableau. Ce tableau étant déclaré comme une variable globale en amont de mon fichier JS.

Voici le code source de ma fonction :

function inputDefault() {
	defaultVal = Array();
	$.ajax({
        type: "GET",
        url: "../autoEmpty.xml",
        dataType: "xml",
        async : false,
        success: function(xml) {
			$(xml).find('value').each(function() {
				defaultVal[''+$(this).find('for').text()+''] = $(this).find('default').text();
			});
       	}
    });
    alert(defaultVal['facebook']);
}


Lorsque je fais un alert de mon tableau avec la clé "facebook", j'ai le droit à un joli "undefined".

J'ai fait ce même alert dans la fonction succes et ca fonctionne bien.

Donc la variable global n'est pas pris en compte dans la fonction succes...

Ma question est la suivante :
Comment puis-je récupérer ce tableau dans une variable global ?

Modifié par ggouhier (26 May 2010 - 15:46)
Tu as vraiment besoin d'avoir un ajax bloquant?
Parce que je vois pas très bien l'intérêt?

Sachant que jQuery utilise des fonctions anonymes mais aussi des fonctions avec des noms :

function xmlReader(xml) {

   $(xml).find('value').each(function() {

      defaultVal[''+$(this).find('for').text()+''] = $(this).find('default').text();

   });

   alert(defaultVal['facebook']);
    ... la suite de mon traitement ....
}

function inputDefault() {

	defaultVal = Array();

	$.ajax({
           type: "GET",
           url: "../autoEmpty.xml",
           dataType: "xml",
           success: xmlReader

       });
}

Modifié par kaen25 (31 May 2010 - 12:42)
pas mieux : ça tue l'affichage d'une page que de passer en XHR synchrone.
tu fais du JS, il va falloir apprendre à développer avec des events et des callbacks Smiley smile
Sujet clos
Aller à