форма не отправляется и проверка не работает - PullRequest
Новая
       21

форма не отправляется и проверка не работает

0 голосов
/ 25 апреля 2020

Я новичок в javascript, я создал регистрационную форму, но она не отправляется и проверка не работает. я не мог знать, что не так в коде. функция проверки заключается в проверке того, содержит ли ввод только буквы

файл. html 

      <!DOCTYPE html>
    <html>
    <head>
     <title></title>
     <link rel="stylesheet" type="text/css" href="css/inscrption_form.css">
     <link href="https://fonts.googleapis.com/css?family=Josefin+Sans&display=swap" rel="stylesheet">
        <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
       <script  type="text/javascript"src="/js/script.js"></script>
    </head>
    <body>
    <header>
     <div class="mainheader">
      <div class="logo">
        <h2> A </h2>
  </div>
 </div>
</header>


    <form id="forme" onsubmit="return valider()">
        <table>
            <tr>
         <td colspan="2" align="center">
                 <h1> Form </h1>
             </tr>
        <tr>.. </tr>
        <tr>
            <td>*Nom</td>
            <td><input type="text" placeholder = "Sara" id = "nom"maxlength="25"  required></td>
            <small id="error2">errr </small>
        </tr>
       <tr>.. </tr>
        <tr>.. </tr>
       <tr>.. </tr>
         <tr>.. </tr>
       <tr>.. </tr>
        <tr>    
            <td colspan="2" align="center">
                <button type="submit"  value="Envoyer">sign up </button>

                <button type="reset"  value="Annuler">Annuler</button>
            </td>
        </tr>
        </table>
     </form>
</body>
</html>

script. js

    function valider()
{
    // nom test 
    var input = document.getElementById('nom');
    var alphabets = /^[A-Za-z]+$/ ;
    if(input.value.match(alphabets))
      { 
        return true ;
    }else{
     document.getElementById('error2').innerText ="only alphabets  "   
        return false ;
    }
}

1 Ответ

0 голосов
/ 25 апреля 2020

Я поместил ваш код во фрагмент, и он отлично работает. Проверка в порядке, и форма отправляется на тот же URL-адрес. Может быть, вы хотите установить атрибут действия для формы и отправки с методом = "POST". 

  function valider()
{
    // nom test 
    var input = document.getElementById('nom');
    var alphabets = /^[A-Za-z]+$/ ;
    if(input.value.match(alphabets))
      { 
        return true ;
    }else{
     document.getElementById('error2').innerText ="only alphabets  "   
        return false ;
    }
}
    <!DOCTYPE html>
    <html>
    <head>
     <title></title>
     <link rel="stylesheet" type="text/css" href="css/inscrption_form.css">
     <link href="https://fonts.googleapis.com/css?family=Josefin+Sans&display=swap" rel="stylesheet">
        <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
       <script  type="text/javascript"src="/js/script.js"></script>
    </head>
    <body>
    <header>
     <div class="mainheader">
      <div class="logo">
        <h2> A </h2>
  </div>
 </div>
</header>


    <form id="forme" onsubmit="return valider()">
        <table>
            <tr>
         <td colspan="2" align="center">
                 <h1> Form </h1>
             </tr>
        <tr>.. </tr>
        <tr>
            <td>*Nom</td>
            <td><input type="text" placeholder = "Sara" id = "nom"maxlength="25"  required></td>
            <small id="error2">errr </small>
        </tr>
       <tr>.. </tr>
        <tr>.. </tr>
       <tr>.. </tr>
         <tr>.. </tr>
       <tr>.. </tr>
        <tr>    
            <td colspan="2" align="center">
                <button type="submit"  value="Envoyer">sign up </button>

                <button type="reset"  value="Annuler">Annuler</button>
            </td>
        </tr>
        </table>
     </form>
</body>
</html>
...