Untitled

<!DOCTYPE html>
<html>
   <head>
      <style>
         ul#nav{
         list-style: none;
         color: orangered;
         margin:0;
         padding:0;
         overflow: hidden;
         background-color: #333;
         }
         li a {
         color: orangered;
         display: block;
         padding: 14px 10px 14px 10px;
         text-decoration: none;
         font-family: Arial;
         font-size: 15px;
         }
         li {
         float: left;
         }
         li a:hover {
         background-color: orange;
         }
         body{
         background-color:orangered
         }
         ul#errors {
         list-style: none;
         }
         ul {
         font-family: Courier New;
         }
         input[type=text] {
         width: 25%;
         padding: 12px 20px;
         margin: 50px 0;
         box-sizing: border-box;
         border-color: black;
         background-color: white;
         color: black;
         font-family: Courier New;
         text-align:center;
         opacity: 0.5;
         }
      </style>
      <script>
         function checkfname()
         {
             var str = document.getElementById("Fname").value;//value היה כתוב לא נכון
             var badvstr = "?%$#!*";
             for (var i = 0; i < badvstr.length; i++)
             {
                 if (str.indexOf(badvstr[i]) != -1)
                 {
                     document.getElementById("errors").innerHTML += "<li>[name is not correct.(first name)]</li > ";//;

                     return false;//;
                 }
             }
             if (!(isNaN(str)))
             {
                 document.getElementById("errors").innerHTML += "<li>[only letters(first name)]</li > ";    //;
                 return false;//;
             }
             if (str.length < 3)
             {
                 document.getElementById("errors").innerHTML += "<li>[type more than 3 letters(first name)]</li > "; //;
                 return false;//;
             }

             return true;
         }

         //******************************************************************************************************************
         function checksurname()
         {
             var str = document.getElementById("surname").value;//value**
             var badvstr = "?%$#!*";
             for (var i = 0; i < badvstr.length; i++)
             {
                 if (str.indexOf(badvstr[i]) != -1)
                 {
                     document.getElementById("errors").innerHTML += "       <li> [name is not correct(surname)]    </li > ";//;
                     return false;//;
                 }
             }
             if (!(isNaN(str)))
             {
                 document.getElementById("errors").innerHTML += "<li>[only letters.(surname)]</li > ";//;
                 return false;//;
             }
             if (str.length < 3)
             {
                 document.getElementById("errors").innerHTML += "<li>[type more than 3 letters(surname)]</li > ";//;
                 return false;
             }
         return true;

         }

          //******************************************************************************************************************
         function checkusername()
         {
             var str = document.getElementById("Uname").value;//value**

             if (str.length < 3)
             {

                 document.getElementById("errors").innerHTML += "<li>[type more than 3 letters(user name)]</li > ";//;
                 return false;

             }
             return true;
         }
          //******************************************************************************************************************

         function checkpassW() {
             var str = document.getElementById("passW").value;

             if (str.length < 3) {

                 document.getElementById("errors").innerHTML += "<li>[type more than 3 letters(password)]</li > ";//;
                 return false;

             }
         return true;

         }
         //******************************************************************************************************************
         function checkemail()
         {
             var str = document.getElementById("email").value;//value

             if (!(str.split("@").length <= 2) && (str.indexOf("@") != 0) && (str.indexOf(".") != 0) &&
                 (str.indexOf(".") != str.length - 1) && (str.length >= 5 && str.length <= 30) && (str.indexOf(".") != -1))
             {
                 document.getElementById("errors").innerHTML += " <li>[הכנס דואר אלקטרוני    xxx@xxx.xx]  </li >        ";
                 return false;
             }
             return true;
         }
         //******************************************************************************************************************
         function checkid()
         {
             var str = document.getElementById("idd").value; //id =reserved word

             if (isNaN(str))
             {
                 document.getElementById("errors").innerHTML += "<li>[type only numbers(id)]</li > ";//;
                 return false;//;
             }

             if (str.length != 9)
             {
                 document.getElementById("errors").innerHTML += "<li>[type 9 letters(id)]</li > ";//;
                 return false;
             }
             return true;
         }
         //******************************************************************************************************************

         function checkphone()
         {
             var str = document.getElementById("Pnumber").value

             if (isNaN(str.split('-')[0]) || isNaN(str.split('-')[1]) || str.charAt(0) != "0")
             {
                 document.getElementById("errors").innerHTML += "<li> [phone number  is not correct(phone number)]</li>"
                 return false
         }
         return true;

         }
          //******************************************************************************************************************
         function checklan()
         {
             var mikum = document.check.lang.selectedIndex;
             if (mikum == 0)
             {
                 document.getElementById("errors").innerHTML += "<li>[select language] </li > "
                 return false
         }
         return true;

         }


         //******************************************************************************************************************
         function checkgen()
         {

                 var male = document.getElementById("male").checked;
                 var female = document.getElementById("female").checked;
                 if (!(male) && !(female))
                 {
                     document.getElementById("errors").innerHTML += "<li> [gender invalid]<li/>"
                     return false;
         }
         return true;

         }

          //******************************************************************************************************************
         function checkALL() {
         document.getElementById('errors').innerHTML = "";
         var result = true;//;
         if (!checkfname())

         result = false;


         if (!checksurname())

         result = false;


         if (!checkusername())

         result = false;


         if (!checkpassW())

         result = false;


         if (!checkemail())

         result = false;


         if (!checkid())

         result = false;
         if (!checkphone())

         result = false;
         if (!checkgen())

         result = false;

         if (!checklan())

         result = false;


         if (result) {
         document.getElementById("errors").innerHTML += "<li> all good </li>";
         document.getElementById("submit").click();
         }
         else {
         alert("not valid");
         }
         }
      </script>
      <meta charset="utf-8" />
      <title></title>
   </head>
   <body  background="https://www.freewebheaders.com/wordpress/wp-content/gallery/mud-ground/dry-brown-lifeless-desert-land-closeup-background-header.jpg" style="background-size:cover">
      <ul id="nav">
         <li><a href="index.aspx">HOME</a></li>
         <li><a href="aboutus.aspx">ABOUT US</a></li>
         <li><a href="bikes.aspx">BIKES</a></li>
         <li><a href="register.aspx">REGISTER</a></li>
         <li><a href="submit.aspx">SIGN IN</a></li>
         <li><a href="date.aspx">TIME&DATE</a></li>
         <li><a href="pictures.html">PICTURES</a></li>
         <li><a href="trivia.aspx">TRIVIA</a></li>
         <li><a href="admin.aspx">ADMIN</a></li>
      </ul>
      <br />
      <br />
      <ul id="errors"></ul>
      <br /><br />
      <form name="check" id="check" action="insert.aspx" method="post">
         <p style="font-size:30px; font-family:'Courier New'; color:white"> first name:</p>
         &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <input type="text" name="Fname" id="Fname" /><br /> <br />
         <p style="font-size:30px; font-family:'Courier New'; color:white"> surname:</p>
         &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="text" name="surname" id="surname" /> <br /> <br />
         <p style="font-size:30px; font-family:'Courier New'; color:white">username:</p>
         &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="text" name="Uname" id="Uname" /><br /> <br />
         <p style="font-size:30px; font-family:'Courier New'; color:white">password:</p>
         &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="text" name="passW" id="passW" /> <br /> <br />
         <p style="font-size:30px; font-family:'Courier New'; color:white">Phone Number:</p>
         <input type="text" id="Pnumber" name="Pnumber" /> <br /> <br />
         <p style="font-size:30px; font-family:'Courier New'; color:white"> mail:</p>
         <input type="text" name="email" id="email" /><br /> <br />
         <p style="font-size:30px; font-family:'Courier New'; color:white">     ID number:</p>
         <input type="text" name="idd" id="idd" /><br /><br />
         <select name="lang" ; id="lang" >
            <option value="">none</option>
            <option value="hebrew">hebrew</option>
            <option value="english">english</option>
            <option value="arabic">arabic</option>
         </select>
         <br />
         <br />
         <input  type="radio" name="gender" value="male" id="male" > Male<br />
         <input type="radio" name="gender" value="female" id="female"> Female<br />
         <br /> <br /> <br />
         <input type="button" value="submit" onclick="checkALL()" />
         <input type="submit"  name="submit" id="submit" hidden/>
      </form>
   </body>
</html>