Discussion :

[Shirraz]

Bonjour,


Je me suis récemment mis aux framework Javascript (Dojo et Proto), notamment pour les requêtes AJAX… La chose semble vraiment indispensable de facilité, mais je n'arrive pas à comprendre certaines choses, et pourtant j'ai passé bien 2h sur Google à comprendre comment ça marche (personne n'exlpiquant clairement, on donne un exemple et basta )…

Bref, assez de bavardage, voilà le script qui est destiné à la zone admin de mon site. J'ai un tableau de tout mes articles, et je voudrais pouvoir en supprimer un par simple click, et que la ligne soit effacées du tableau et que je soit averti que tout s'est bien passé (en placant le retour HTML du script PHP). Ça marchait avec une requête XHR "normale".

Code :

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

1
2
3
4
5
6
7
8
9
10
function erase(idarticle, titre, cat, sc, rowID)
	{
	if(confirm("Supprimer l\'article \""+titre+"\" ?"))
		{
		var url		= '_AJAX/erase.php';
		var params	= 'id='+idarticle+'&cat='+cat+'&sc='+sc;
 
		var ajax	= new Ajax.Request(url, {method: 'post', parameters: params, OnSuccess: ajout});
		}
	}

Code :

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

1
2
3
4
5
6
7
function ajout(transport) 
	{
	var data	= transport.responseText;
	var divInfo	= $("info");
	divInfo.innerHTML = "";
	divInfo.innerHTML = data;
	}

Premièrement, j'ai du mal à comprendre ce que l'on peut mettre après "OnSuccess/OnComplete/etc.". J'ai cru comprendre qu'il n'y a que deux arguments que l'on puisse passer à la function : la réponse et une option (apparemment pour JSON). J'ai aussi cru comprendre qu'on met généralement "transport" mais que je pourrais aussi bien mettre "machin"…

Deuxièmement, l'article est bien effacé, mais aucun message de confirmation n'apparaît, mon script ressemble pourtant en tout point à des scripts vus sur le net et fonctionnant. J'ai essayé plusieurs configurations, mais en vain. Parmi celle-ci j'ai essayer de placer la fonction à l'intérieur de l'objet requête comme ceci, mais toujours rien !

Code :

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

1
2
3
var ajax = new Ajax.Request(url, {method: 'post', parameters: params, OnSuccess: function(transport) {
	var response = transport.responseText;
	$('info').innerHTML = response;}});

Merci de m'expliquer plus en détail le fonctionnement de la chose, je perds patience

[Bovino]

OnSuccess

Attention, c'est onSuccess et JavaScript (donc Prototype aussi !) est plutôt chatouilleux avec la casse !

Code :

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

1
2
3
4
5
6
7
8
var ajax = new Ajax.Request(url, {
    method: 'post',
    parameters: params,
    onSuccess: function(transport) {
        var response = transport.responseText;
        $('info').innerHTML = response;
    }
});

[Shirraz]

Qu'est-ce que je me hais pour des broutilles comme ça Merci beaucoup !


Mes autres questions restent toutefois valables toutefois, nottament pour effacer la ligne corresopnd à l'article supprimer. Je ne vois pas comment je peut passer l'id de ce dernier :p

[gwyohm]

Tu ne construis pas les parametres comme il faut : il faut faire comme ca :

Code :

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

1
2
3
4
5
var params = {
  id : idarticle,
  cat : cat,
  sc : sc
}

[Shirraz]

Tu ne construis pas les parametres comme il faut : il faut faire comme ca :

Code :

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

1
2
3
4
5
var params = {
  id : idarticle,
  cat : cat,
  sc : sc
}

Les deux syntaxes semblent fonctionner, quel est l'intérêt de l'écrire ainsi ?

[gwyohm]

Effectivement, j'ai relu la doc les 2 passent.
http://prototypejs.org/api/ajax/options
L'avantage (à mon sens) c'est que c'est plus lisible et plus facile à maintenir ... mais ce n'est que mon avis

[Shirraz]

Effectivement, j'ai relu la doc les 2 passent.
http://prototypejs.org/api/ajax/options
L'avantage (à mon sens) c'est que c'est plus lisible et plus facile à maintenir ... mais ce n'est que mon avis

Ok, je pense que je vais adopter la manière conseillée de toutes façons

[Shirraz]

J'attaque de nouveau… Cette fois-ci je suis vraiment dans l'incompréhension, pas par manque de savoir mais parce que j'ai beau chercher, je vois pas le problème :s


"transport" est indéfini, j'ai pourtant même copié/collé une requête fonctionnant pour le cas extrême où avec la fatigue je serais incapable de ne pas voir l'erreur, mais rien… Le plus étrange est que la console m'indique que la requête s'est bien passé, et j'ai même la réponse, mais Prototype ne veut rien savoir… Je vous met la requête au cas où, mais c'est vraiment bizarre

Code :

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

1
2
3
var newAjax		= new Ajax.Request(url, {method: 'post', parameters: params, onSuccess: function(transport){
	var response	= transport.responseText;
		}});

[Bovino]

Code :

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

var response	= transport.responseText;

Euh... là, tu ne fais qu'affecter le résultat de ta requête à une variable, qu'est-ce qui te fais dire que Prototype ne la prend pas en compte ?
Que te donne

Code :

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

1
2
var response	= transport.responseText;
alert(response);

[Shirraz]

Arh, j'étais vraiment trop fatigué, je viens de reprendre et mon erreur c'était de vouloir assigner la valeur de response à un div, chose que je voulais faire en-dehors de la fonction…


C'est bon, merci tout de même !