Discussion :

[CrasherSEP]

Bonjour,

Pas certain d'être dans la bonne section, mais bon... ;-)

J'aimerai créer, insérer un mots croisés sur mon site, via une page *.html

Ce qui fonctionne pour le moment :

• Page *.html avec une grille (mots croisés *. jpg) et les définitions avec champs <input> pour les réponses.
• La vérification des réponses ainsi que l'envoi se fait via *.php

Ce que j'aimerais :
Pour que cela soit plus visuel, j'aimerais que lorsque je rentre un mot dans un <input> - exemple : "maison", les cases de la grille (Tableau avec champs) contenant le mot "maison", affiche les lettres case 1 : m, case 2 : a, case 3 : i, case 4 : s...

Pour moi, il faudrait :
01. récupérer les lettres des <input> dans des variables en vérifiant évidemment si il n'y a pas plus de lettre que de cases pour le mot,
02. attribuer ces lettres dans les différentes cases de la grille,

Mais comment.... :-/ ?????

Auriez-vous une idée du code ?

[yjuliet]

pour récupérer la valeur du input :

Code :

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

var maVar= document.getElementById('idDeTonInput').value;

Pour le répartir dans ta grille, une boucle for sur la longueur de la chaine récupérée et la méthode charat(n) des String. L'indice de ta boucle for te donne aussi l'offset de ta grille.

[CrasherSEP]

Bonjour,

Super, à vous lire, cela est donc possible voir même très facile... :-/ Mais n'étant pas un Pro. pourriez-vous me donner une exemple avec un <input> mot -> les cases ?

GRAND merci d'avance :-)

[yjuliet]

Tout dépend de la conception de ta grille dans le code HTML, chose probablement la plus difficile dans ton cas. La grille peut être réalisée à l'aide d'un <TABLE> HTML dans laquelle tu pourrais envisager de mettre d'autres INPUT, ou bien avec des images et un <CANVAS> HTML5, plus complexe à utiliser mais permettant un rendu beaucoup plus sympa, voire avec du SVG embarqué, ...

Si tu débutes en JS / HTML, je te conseille fortement de commencer par la lecture des tutoriels. Ils te donneront les bonnes pratiques qui te permettront de concevoir correctement ton système afin de pouvoir utiliser un code potentiellement plus facile à écrire.

[CrasherSEP]

Pour le moment, c'est une <TABLE> HTML avec <INPUT>

Peut-être simple, mais à mon avis plus à ma portée, si je pouvais avoir un petit exemple... ;-)

[yjuliet]

Réfléchis déjà à ton algorithme, à ce que tu veux faire :
"je parcours ma chaine caractère par caractère et avec chacun des caractères, je le place à telle position dans mon tableau." Une fois que tu as ça, dans les tutoriaux, tu trouveras comment le traduire en langage JS.