Bonjour à tous et à toutes,

je dois faire une application seulement en JavaScript et j'ai besoin de deux formulaires : un d'inscription et au autre de connexion qui doivent comporter le pseudo et un mot de passe, j'ai cherché sur Google et j'ai trouvé des formulaires de connexions mais les formulaires d'inscription étaient incomplets puis surtout je ne savais pas relier le formulaire d'inscription et celui de connexion, si quelqu'un peut m'expliquer comment faire un formulaire d'inscription et de connexion en JavaScript ou a un tuto à me conseiller, j'en serai ravi

Merci d'avance

Bonjour,

Alors il ne faut pas oublier que tu as le côté client (que tu ne dois traîter qu'en JS, pour la fluidité j'imagine), et le côté serveur. Il faut que tu fasses le traîtement du côté serveur en PHP ou autre, et que tu ne renvoies que les informations en JSON, ainsi tu pourras récupérer les informations en JS.

Imaginons, tu fais une requêtes AJAX pour envoyer au serveur les informations d'inscription, le serveur les traîte en PHP, et te renvoie si ça a fonctionner ou non. Et ensuite tu le connectes, et voilà. Je ne suis pas sûr d'être clair

J'ai pas tous compris, mais en résumé je suis obligé d''utiliser un langage de programmation comme php ou ajax car ce que je veux faire traite avec le serveur, c'est ça ?

Le truc c'est que JavaScript est executé du côté client (sauf dans le cas de NodeJS qu'on peut executer sur le serveur, mais personnellement je l'utiliserais plutôt pour une application particulière qu'un site Web), et le PHP ou beaucoup d'autres s'executent sur le serveur.

Le PHP irait faire le traitement comme insertion en base de données, gestion des sessions etc, et le JavaScript traiterait tout ce qu'il y a du côté client. Et AJAX fait partie de JavaScript.

Au fait, c'est quel genre d'application ?

Suis-je plus clair ?

-
Edité par gzJVXfXC9 28 mars 2016 à 13:24:41

En gros, je veux faire une application sur la robotique, il y a un formulaire dans lequel l'utilisateur écrit par exemple nao, puis il y a une description du robot qui apparait. Cependant pour pousser l'utilisateur a cherché le plus de mots différents, des badges apparaitront à partir d'un nombre de mots cherchés mais pour que l'utilisateur ait ses badges, il est obligé d'avoir un compte autrement la variable contenant le nombre de mot cherché, une fois la page réactualisée serait égale à zéro.

J'espère avoir été clair, n'hésite pas à me dire de quel manière dois-je procédé afin que l'utilisateur ait un compte, voici le code pour l'instant : https://jsfiddle.net/Fatavis/os36zq0c/34/

Ok je vois le genre ! J'aime bien ton bouton "Je suis un robot", il est plutôt cool !

Alors selon moi tu fais une partie en PHP du côté du serveur, avec le langage que tu connais le mieux. Tu fais une méthode qui va gérer l'inscription des gens, et tu fais le formulaire en HTML. Tu n'échapperas pas au traitement côté serveur de toute façon.

Là où tu veux "tout en JS", c'est pour la recherche, non ? En gros tu veux qu'il y ait de l'autosuggestion (comme Google par exemple), que l'envoie du nombres de mots soit automatique en JS, non ?

Je ne suis pas sûr d'avoir été clair, si tu veux plus de renseignements dis-le moi.

Je crois que je me suis mal exprimé car je ne veux pas faire de l'autosuggestion mais plus un truc comme ça, en pseudo-langage :

var nao;

var irobotechart;

var compteur = irobotechart + nao ;

quand on met nao dans le formulaire, cela fait nao++,

si nao >1 alors nao--

puis j'ai une image (badge)  tout en bas et quand compteur=1 alors l'image est visible

En résumé je veux qu'une image s'affiche en fonction des mots différents que l'utilisateur va cherché, par exemple s'il en a cherché 20 alors une autre image devient visible (badge).

Mais le problème est que quand l'utilisateur va recharger la page alors la variable compteur retombe à zéro c'est pour cela que j'ai besoin que l'utilisateur ait un compte mais le problème c'est que je ne connait absolument rien en php et je suis embêté.

J'espère que c'est plus clair, à mois que je donne un code que l'utilisateur pourra mettre dans un formulaire afin qu'il récupère le badge mais il suffit de se les communiquer pour avoir tous les badges.

Bon alors pour être honnête je n'ai pas tout compris avec ton histoire de badge.. Tu sais faire le calcul de ça ? Si non, il me faudra plus d'explications pour t'aiguiller

Quand la personne quitte la page, ou lors d'un enregistrement, à toi de décider quand, tu devras faire une requête AJAX. (jQuery te simplifie la vie pour ça). Cette requête se contentera de faire appel à une page PHP que tu auras créée, en lui envoyant le résultat de ton compteur.

Ensuite il ne restera plus qu'à faire le code PHP, je pense qu'il vaut mieux avoir déjà le reste fonctionnel pour faire le PHP.

Finalement je vais réaliser le code en Javascript, comme cela vous verrez mieux ce que j'attends puis après je relancerai le sujet en mettant le code et vous me direz la démarche à suivre en Php.

J'ai avancé sur le développement de mon code en JavaScript mais après élimination j'ai remarqué que l'image s'affiche bien, que la var naoV augmente bien de 1 lorsqu'on met nao dans le formulaire cependant la variable compteur elle n'augmente pas ce qui empêche mon image de devenir visible pouvez-vous me dire où je me suis trompé (à mon avis au niveau de la variable compteur) ?

Voilà le code, excusez-moi : https://jsfiddle.net/Fatavis/os36zq0c/57/

C'est normal, j'ai compris la logique que tu veux faire mais ce n'est pas possible à ce stade, il faut que tu incrémentes toi même le compteur.

Mais comment j'incrémente, moi même (à vrai dire je n'ai pas vraiment compris) ?

Au faite là tu incrémentes naoV et irobotechartV en pensant que sa va incrément compteur vu que tu as déclarer "compteur = naoV + irobotechartV" sauf que ce n'est pas possible donc remplace ton "naoV = naoV + 1" par "compteur++".

Mais le problème est que si on clique deux fois sur le bouton avec nao au lieu d'avoir cherché des mots différents, il suffit de spammer le bouton entrée pour que la variable  compteur augmente et du coup c'est de la triche, il n'y a pas un autre moyen que de faire compteur++  ?

Tu créé un tableau qui va gérer tout sa: 

var active_word = ['nao','irobotmachin'];

//Quand il va rentrer nao par exemple
//On récupère à quel index est nao dans le tableau
var index_of_nao = active_word.indexOf('nao');

//Si nao est encore dans le tableau
if(index_of_nao > -1){
  compteur++;
  
  //On enlève nao du tableau 
  active_word.splice(index_of_nao, 1);
}
else{
  alert('Vous avez déjà utilisez nao !');
}

-
Edité par Penmaster 29 mars 2016 à 20:08:06

Merci mais je dois le placer où dans mon code ?

https://jsfiddle.net/Fatavis/os36zq0c/60/

Voilà j'ai créé une fonction qui a chaque fois que l'utilisation va rentrer un mot souhaité (nao,irobotmachin) va regarder dans le tableau si le mot est présent, si il est encore présent il ajoute 1 au compteur et enlève le mot du tableau sinon il affiche une alert:

https://jsfiddle.net/os36zq0c/61/

Mais il reste un problème la fonction suivante ne s’exécute pas car l'image ne s’affiche pas :

if (compteur==1)
{

       document.getElementById("badge1").style.visibility="visible";
      }

Il suffisait de le rajouter dans la fonction:

https://jsfiddle.net/os36zq0c/62/

Salut, j'ai tout compris sur le code que tu m'as donné mais je voudrais savoir si je dois remplacer word pour chaque mot (nao, irobotechart...) et donc copier plusieurs fois ce bout de code ou si elle fonctionne pour tous les mots, et alors j'ai un problème avec irobotechart ?

Non il te suffit de rajouter la fonction checkWord('TONMOT') dans chaque case de ton switch pour faire la vérification.

Voilà j'ai fini le prototype de l'application web (https://jsfiddle.net/Fatavis/os36zq0c/68/) et le problème est qu'à chaque fois que l’utilisateur recharge sa page le tableau se réactualise et les badges redeviennent en caché, comment faire en PHP pour que les badges ne s'effacent pas et donc comment faire pour que l'utilisateur puisse s'inscrire et se connecter  ?

Là d'après ce que j'ai compris ça semble fonctionner, non ?

Tu n'as plus qu'à persister les informations. Donc le plus simple selon moi c'est de faire une requête AJAX en JavaScript vers ton serveur à une certaine URL, en lui envoyant, pour l'utilisateur en question, les badges qu'il a. Sur le serveur en PHP tu les enregistres en base de données, et la fois suivante quand il revient tu vas lire ces informations pour vérifier s'il a tel ou tel badge.

Du coup j'ai pas le choix d’apprendre l'AJAX ou le PHP ?

Bon dernière question avant d'apprendre, est-il plus rapide, plus utile que j'apprenne le PHP ou l'AJAX?

Ta question n'a aucun sens. L'ajax permet de faire des appels au serveur via javascript (donc d'executer un code php ou autre). L'ajax n'est pas un langage de programmation. Le php lui l'est.

D'accord, merci quand même.