Discussion :

[r-zo]

Bonjour à tous,

j'essaie de faire de la POO avec javascript et je suis en train de me battre avec des histoires de scope de 'this'

voici la partie du code qui m'intéresse

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
43
44
45
46
47
48
49
 
function Treeview()
{
	this.ajaxUrl = "";
	this.ajaxMethod = "GET";
	this.parentNode;
}
 
[...]
 
Treeview.prototype.callUrl = function( url , nodeId)
{
	$.ajax( { 'data' : 'id=' + nodeId,
			  'url' : url ,
			  'datatype' : 'xml',
			  'success' : this.displayNodes.apply(this  ),
			  'error' : this.ajaxCallError.apply(this )
			}
			);
}
 
Treeview.prototype.displayNodes = function( data, textStatus, XMLHttpRequest)
{
	this.parentNode.html('processing ....')
 
	$(data).find('node').each(function()
			{
				(blablabla)
			}
	)
 
[...]
}
 
Treeview.prototype.ajaxCallError = function( XMLHttpRequest, textStatus, errorThrown)
{
	this.error( textStatus + ' : ' + errorThrown )
}
 
Treeview.prototype.init = function( defaultNodeId)
{
	var url = this.getAjaxUrl();
	if( url == null)this.error( 'url must be set' );
 
	if( defaultNodeId == null )defaultNodeId = 0;
	this.parentNode = $("#treeview");
 
	this.callUrl(url, defaultNodeId);
}

tout va bien jusqu'au moment où il arrive dans ma méthode 'displayNodes' où il perdait la notion de 'this' qui devait un objet renvoyé par jquery. J'ai pu modifier ce comportement en utilisation la fonction 'apply'.
Depuis cette modification, je ne peux plus accéder aux variables renvoyées par la fonction de callback; en clair, dans la méthode 'displayNodes', 'data', 'textStatus', 'XMLHttpRequest' sont nulles.

la question est : comment faire pour utiliser apply (ou call) en ayant toujours accès à ces variables de callback ? J'ai vu que dans apply, on peut passer des paramètres mais comme ils n'existent pas au moment de déclarer la fonction de callback ...


par avance merci

[gael]

Il faut que tu mettes les arguments de la fonction displayNodes dans un tableau et que tu passes ce tableau en argument de ta fonction apply

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

this.displayNodes.apply(this , [ data , textStatus , XMLHttpRequest  ])

Bien sûr, il faut remplacer data , textStatus et XMLHttpRequest par leur valeur.

http://www.coursweb.ch/javascript/apply-call.html

[r-zo]

Tout d'abord merci pour ta réponse mais cela ne résous rien.
J'avais déjà essayé cette syntaxe mais j'ai une erreur javascript comme quoi 'data' n'existe pas au niveau de la ligne

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
$.ajax( { 'data' : this.params,
			  'url' : url ,
			  'success' :  this.displayNodes.apply( this , [ data, textStatus, XMLHttpRequest ])
			}
			);

cette erreur est logique car au moment de spécifier la fonction de callback, ces paramètres n'existent pas encore et ne seront fournis qu'à l'appel effectif de la fonction par jquery.

C'est pour cela que je ne comprends pas ta phrase où tu veux que je remplace ces paramètres par leur valeur.

ou alors j'ai pas compris ton explication ou pire, pas compris la POO dans JS

[r-zo]

J'ai trouvé une solution qui n'a rien à voir avec l'utilisation des fonctions call et apply

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
Treeview.prototype.callUrl = function( url )
{
	var instance=this;
	$.ajax( { 'data' : this.ajaxParams,
			  'url' : url ,
			  'success' : function( data, textStatus, XMLHttpRequest )
			  {
				instance.displayNodes( data, textStatus, XMLHttpRequest )
			  }
			}
			);
}

et "bizarrement" dans ma fonction displayNodes, "this" redevient mon instance.

Si quelqu'un a une manière de procéder plus élégante ..

Merci Gael en tout cas

[gael]

data, textStatus, XMLHttpRequest sont des propriétés de l'objet passé en argument? Dans ce cas, il ne faut pas mettre d'arguments à ta fonction displayNodes et remplacer data par this.data, ...