Untitled

<!DOCTYPE html>
<html>
    <head>
        <title>Ma Page</title>
        <meta charset="UTF-8" />
    </head>
    <body>
        <form id="myForm" action="#" onsubmit="myFunction();return false">
            <label for="inputText">Mon Champ Texte : </label>
            <input type="text" name="textValue" />
            <label>Mon Champ Numérique : </label>
            <input type="number" name="numberValue">
            <button>Valider</button>
        </form>
        <div>
            <p id="resultParagraph"></p>
        </div>
        <script type="text/javascript">
            myFunction = function() {
                /* Etape 1 : On récupère les données du formulaire via son id */
                var formElements = document.getElementById("myForm").elements;
                var userData = [];
                for(var i = 0 ; i < formElements.length ; i++){
                    var item = formElements.item(i);
                    userData[item.name] = item.value;
                }

                /* Etape 2 : Intègre ci-dessous le traitement que tu as à faire sur les données qui se trouvent dans le tabeau 'userData' */
                // Traitement ici...

                /* Etape 3 : Affiche le résultat attendu ensuite dans la page HTML */
                // Ici par exemple, je récupère le paragraphe <p> qui possède l'id 'resultParagraph' et je modifie son contenu.
                document.getElementById('resultParagraph').innerHTML = "L'utilisateur a envoyé le texte '" + userData['textValue'] + "' et le nombre '" + userData['numberValue'] + "'";
            }
        </script>
    </body>
</html>