Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

HTML Discussion :

INPUT type texte formaté pour IBAN


Sujet :

HTML

  1. #1
    Nouveau membre du Club
    INPUT type texte formaté pour IBAN
    Bonjour, je doit inserer dans un formulaire une demande d'IBAN.
    Seuement, il faut 1 seul input text qui serait comme suit :

    |_||_||_||_| |_||_||_||_| |_||_||_||_| |_||_||_||_| |_||_||_||_| |_||_||_||_| |_|

    J'y arrive en faisant 27 input text mais ce n'est pas ce que je voudrais.
    je veux vraiment 1 seul input text.


    Comment faire ?

    cdt et merci de votre aide

  2. #2
    Rédacteur/Modérateur

    Salut

    Une alternative
    Code :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
    	<body>	<!-- ............................................................................................................. -->
    					Entrez votre code IBAN<br />
    					<input type="text" id="iban" style="width:190px; font-size:14px; font-family:courrier" placeholder="27 caractère pour un code IBAN" maxlength="27" oninput="VerifEnter()" ><span id="alerte"></span>
    		<script>        // ............................................................................................................. //
                            function VerifEnter(){
                                    let Elem = document.getElementById("iban");
                                    let LeText = Elem.value;
                                    let lenText = LeText.length
                                    if (lenText === 27)
                                    {
                                            Elem.style.backgroundColor="#ccffcc";
                                            }else{
                                            Elem.style.backgroundColor='white';
                                    }
     
                                    // encore une autre vérification
                                    let txtverif = LeText.toUpperCase();
                                    if (lenText >=2 && txtverif.slice(0,2) !="FR"){
                                            document.getElementById("alerte").textContent="*** Vous devez enter un code IBAN Français ***";
                                            }else{
                                            document.getElementById("alerte").textContent="";
                                    }
                            }
                            </script>	<!-- ........................................................................................................... -->
    	</body>	<!-- ............................................................................................................. -->
    Soyez sympa, pensez -y
    Balises[CODE]...[/CODE]
    Balises[CODE=NomDuLangage]...[/CODE] quand vous mettez du code d'un autre langage que celui du forum ou vous postez.
    Balises[C]...[/C] code intégré dans une phrase.
    Balises[C=NomDuLangage]...[/C] code intégré dans une phrase quand vous mettez du code d'un autre langage que celui du forum ou vous postez.
    Le bouton en fin de discussion, quand vous avez obtenu l'aide attendue.
    ......... et pourquoi pas, pour remercier, un pour celui/ceux qui vous ont dépannés.

  3. #3
    Nouveau membre du Club
    Bonjour, et merci pour cette réponse mais ce n'est pas ce que je voudrais;
    Je ne veux pas un seule seule "case" visible mais bien 27 "cases".

    Je ne sais pas comment faire ?

    cdt

  4. #4
    Expert confirmé
    Regardes du coté des "mask input". Exemple de plugin: https://github.com/RobinHerbots/Inputmask
    Il vaut mieux mobiliser son intelligence sur des conneries que mobiliser sa connerie sur des choses intelligentes --- devise SHADOKS

    Kit de survie Android : mon guide pour apprendre à programmer sur Android, mon tutoriel sur les web services et enfin l'outil en ligne pour vous faire gagner du temps - N'oubliez pas de consulter la FAQ Android