11498 sujets

JavaScript, DOM et API Web HTML5

Bonjour !
Créant un formulaire d'inscription, je bloque sur un ptit point.
Je vérifie la disponibilité d'un login via Ajax (plus particulièrement via le framework Ajax de prototype), ainsi que les autres champs en javascript (avant de passer au php...).
La vérification se lance au onblur du champ de texte. Si ok : la cellule du tableau listeErreurs[] correpondante au champ est mise à 0, et si pas ok, mise à 1.
A l'envoi du formulaire, je parcours le tableau pour voir si le tableau contient un 1... Sinon j'envoie le formulaire.

Pour l'instant, tout est ok. Sauf 1 chose, je n'arrive pas à mettre ma cellule de tableau à 1 si le login existe déjà.
C'est simple : au onblur de la case login, je fais un appel Ajax avec prototype comme ceci :
var url = 'ajaxInscription.php';
var params = arg + '=' + $F(arg); // arg étant ici l'id du champ du login
var ajax = new Ajax.Updater({success: arg+'Valid'}, url, {
method: 'post',
parameters: params,
encoding: 'UTF-8',
evalScripts: true
});

Le code php renvoi soit une croix rouge, soit un v vert pour préciser si c'est pris ou non :
if ($count>0) { // je vous passe le test mysql précédant ceci..
echo '<img src="iconeValidN.png" alt="Ce pseudo est déjà  utilisé !" />'; // croix rouge
} else {
echo '<img src="iconeValid.png" alt="Ce pseudo est valide." />'; // croix verte
}

Je récupère donc le contenu renvoyé par echo dans un span prévu à cet effet à côté du champ.
MAIS si le test renvoie la croix rouge, il ne met cependant pas la cellule de mon tableau listeErreurs[] à 1. Donc la validation à la soumission du formulaire passe sans problème...

OR, impossible de récupérer une variable de ma page d'où j'appelle le fichier php, dans ce que renvoie ce fichier php.
Exemple :
echo '<img src="iconeValidN.png" alt="Ce pseudo est déjà  utilisé !" onload="listeErreurs[0]=1;" />';

me renvoi que listeErreurs n'est pas défini...

Du coup, je ne vois pas à quel moment je peux vérifier le résultat du test php et passer ma cellule de tableau à 1 en javascript...
Modifié par PierreG (14 Jun 2008 - 14:30)
Bonjour,

Une fois de plus, le framework Prototype n'est peut-être pas adapté à ce qu'il y a à faire. Enfin...

Peux-tu donner la fonction Javascript qui traite le retour de la requête (à savoir la fonction appelée par {success: arg+'Valid'}) ?
Salut,

'evalScripts' de Prototype repose sur l'instruction 'eval()' et donc il faut se soumettre à ces contraintes.
Une solution est de tester l'existence de ton image lors de la requête.

Exemple:

onSuccess: function(response){
if (response.responseText.match("iconeValid")) listeErreurs[0]=1;
}
Problème résolu !

Simplement, j'utilisais onSuccess, alors qu'onComplete est plus judicieux : onSuccess s'exécute avant l'insertion innerHTML, alors que onComplete s'exécute après, quand la requête est réellement terminée.

@kalipka : protoype est très adapté, car j'utilise ici un système de lightbox qui passe par prototype (lightview). Le framework est déjà en place, je ne vois pas pourquoi je n'en profiterais pas pour faire ma requête ajax sans avoir à rajouter des tonnes de codes !