Auto complétion pour TextArea

**Bragu Demon** · 04/09/2017, 15h53

Bonjour à tous,

J'ai développé une page web contenant 3 textarea.
Ces textarea seront remplis par les utilisateurs.
Je souhaiterais implémenter la saisie semi-automatique, pour que chaque utilisateur puisse retrouver les infos qu'il y a déjà saisies, à la manière du champ de recherche du forum :
Nom : 2017-09-04 15_29_53-JavaScript - Ouvrir une nouvelle discussion.png
Affichages : 60
Taille : 3,6 Ko

Nom : 2017-09-04 15_29_53-JavaScript - Ouvrir une nouvelle discussion.png
Affichages : 60
Taille : 3,6 Ko

Voici ce qu'il y a dans la balise head :

Code HTML :

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

1
2
3
4
5
6
7
8
9
10
11
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8"> 
    <meta http-equiv="refresh" content="3600" />
    <link rel="stylesheet" href="ressources/css/style.css" />
    <script type="text/javascript" src="ressources/js/script.js"></script>
    <script type="text/javascript" src="ressources/js/ephemeris.js"></script>
    <link rel="shortcut icon" href="ressources/img/favicon.png" type="image/png" />
    <title></title>
  </head>

Code HTML :

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
 
        <table id="champLibre" border="1" width="100%">
          <tr>
            <td style="width:9%;">
              A :
            </td>
            <td style="width:30%;">
              <textarea placeholder="indiquer ici la valeur A" rows="1" id="vala" class="txtarea"></textarea>
            </td>
            <td style="width:9%;">
              B :
            </td>
            <td style="width:30%;">
              <textarea placeholder="indiquer ici la valeur B" rows="1" id="valb" class="txtarea"></textarea>
            </td>
          </tr>
            <tr>
            <td>
              C :
            </td>
            <td colspan="5">
              <textarea placeholder="indiquer ici la valeur C"  class="txtarea" id="valc"></textarea>
            </td>
          </tr>
        </table>

Je serai friand d'indice sur la meilleure façon de gérer ça.

Merci par avance pour vos conseils

**NoSmoking** · 04/09/2017, 16h48

Bonjour,
pourquoi ne pas laisser faire le navigateur de chacun d'autant qu'il va te falloir stocker les données pour chacun de tes visiteurs ?

Une piste pourrait-être les éléments <datalist>, cela n'empêchera pas la gestion comme dit ci dessus.

Elément <datalist> sur MDN
L'autocomplétion native en HTML5 par Bovino

**Bragu Demon** · 04/09/2017, 17h11

Merci pour la réponse,

Je vais regarder ça de près, parce que laisser faire le navigateur de chacun c'est pile ce qui m'intéresse :-)

**Bragu Demon** · 07/09/2017, 15h39

Je viens de regarder <datalist> mais je suis sceptique sur l’implémentation...
Je suis en train de parcourir ce tuto mais j'ai l'impression que c'est une usine à gaz monumentale ...

Mais je persiste :-)

**NoSmoking** · 10/09/2017, 07h59

... mais j'ai l'impression que c'est une usine à gaz monumentale ...

je ne comprend pas ton réel souhait, tu as pourtant dit que

parce que laisser faire le navigateur de chacun c'est pile ce qui m'intéresse

**Bragu Demon** · 10/09/2017, 08h18

C'est exact, mais je ne vois pas comment implémenter les balises <datalist> pour répondre à mon besoin, garder "quelque part" ce que les utilisateurs saisiront pour pouvoir le retrouver.

Il peut s'agir de nom de serveurs.

Du coup chaque utilisateur aurait une liste des serveurs sur lesquels il se connecte.