Почему всякий раз, когда я отправляю форму, она просит выбрать мужчину / женщину, а форма не отправляется - PullRequest
Новая
       3

Почему всякий раз, когда я отправляю форму, она просит выбрать мужчину / женщину, а форма не отправляется

0 голосов
/ 02 августа 2020 

function validation() {
  var uid = document.registration.userid;
  var passid = document.registration.passid;
  var uname = document.registration.name;
  var uadd = document.registration.address;
  var ucountry = document.registration.country;
  var uzip = document.registration.zip;
  var uemail = document.registration.email;
  var umsex = document.registration.sex;
  var ufsex = document.registration.sex;

  if (userid_validation(uid, 5, 12)) {
    if (passid_validation(passid, 7, 12)) {
      if (allLetter(uname)) {
        if (alphanumeric(uadd)) {
          if (countryselect(ucountry)) {
            if (allnumeric(uzip)) {
              if (ValidateEmail(uemail)) {
                if (validsex(umsex, ufsex)) {}
              }
            }
          }
        }
      }
    }
  }
  return false;
}

function userid_validation(uid, mx, my) {
  var uid_len = uid.value.length;
  if (uid_len == 0 || uid_len >= my || uid_len < mx) {
    alert("User Id should not be empty or length should be between " + mx + " to " + my);
    uid.focus();
    return false;
  }
  return true;
}


function passid_validation(passid, mx, my) {
  var passid_len = passid.value.length;
  if (passid_len == 0 || passid_len >= my || passid_len < mx) {
    alert("Password should not be empty or length should be between " + mx + " to " + my);
    passid.focus();
    return false;
  }
  return true;
}

function allLetter(uname) {
  var letters = /^[A-Za-z ]+$/;
  if (uname.value.match(letters)) {
    return true;
  } else {
    alert('Name must have alphabet characters only');
    uname.focus();
    return false;
  }
}

function alphanumeric(uadd) {
  var letters = /^[0-9a-zA-Z]+$/;
  if (uadd.value.match(letters)) {
    return true;
  } else {
    alert('User address must have alphanumeric characters only');
    uadd.focus();
    return false;
  }
}

function countryselect(ucountry) {
  if (ucountry.value == "Default") {
    alert('Select your country from the list');
    ucountry.focus();
    return false;
  } else {
    return true;
  }
}

function allnumeric(uzip) {
  var numbers = /^[0-9]+$/;
  if (uzip.value.match(numbers)) {
    return true;
  } else {
    alert('ZIP code must have numeric characters only');
    uzip.focus();
    return false;
  }
}


function ValidateEmail(uemail) {
  var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
  if (uemail.value.match(mailformat)) {
    return true;
  } else {
    alert("You have entered an invalid email address!");
    uemail.focus();
    return false;
  }
}


function validsex(umsex, ufsex) {
  x = 0;

  if (umsex.checked) {
    x++;
  }
  if (ufsex.checked) {
    x++;
  }
  if (x == 0) {
    alert('Select Male/Female');
    umsex.focus();
    return false;
  } else {
    alert('Form Successfully Submitted');
    window.location.reload()
    return true;
  }
}
h1 {
  margin-left: 400px;
}

form li {
  list-style: none;
}

form {
  margin-left: 320px;
}

form ul li label {
  float: left;
  clear: left;
  width: 100px;
  text-align: right;
  margin-right: 10px;
  font-size: 18px;
  font-weight: bold;
}

form ul li input,
select,
span {
  float: left;
  margin-bottom: 10px;
}

form textarea {
  float: left;
  width: 350px;
  height: 200px;
}

[type="submit"] {
  clear: left;
  margin-left: 255px;
  margin-top: 20px;
  font-size: 18px
}

p {
  margin-left: 70px;
  font-weight: bold;
}
<!DOCTYPE html>
<html>

<head>

  <title> Exercise 4 (Registration Page) </title>
  <link rel="stylesheet" href="E4.css">
  <script src="E4.js"></script>
</head>
<h1>Registration Form</h1>
<form name='registration' onSubmit="return validation();">
  <ul>
    <li><label for="userid">User id:</label></li>
    <li><input type="text" name="userid" size="12" /></li>

    <li><label for="passid">Password:</label></li>
    <li><input type="password" name="passid" size="12" /></li>

    <li><label for="name">Name:</label></li>
    <li><input type="text" name="name" size="50" /></li>

    <li><label for="address">Address:</label></li>
    <li><input type="text" name="address" size="50" /></li>

    <li><label for="country">Country:</label></li>
    <li>
      <select name="country">

        <option selected="" value="Default">(Please select a country)</option>
        <option>Australia</option>
        <option>Afghanistan</option>
        <option>Brazil</option>
        <option>China</option>
        <option>Canada</option>
        <option>Denmark</option>
        <option>Egypt</option>
        <option>France</option>
        <option>Germany</option>
        <option>India</option>
        <option>Japan</option>
        <option>Korea</option>
        <option>Madagascar</option>
        <option>Malaysia</option>
        <option>Nepal</option>
        <option>New Zealand</option>
        <option>Nigeria</option>
        <option>Philippines</option>
        <option>Qatar</option>
        <option>Russia</option>
        <option>Saudi Arabia</option>
        <option>Serbia</option>
        <option>Singapore</option>
        <option>South Africa</option>
        <option>Spain</option>
        <option>Turkey</option>
        <option>USA</option>
        <option>Yemen</option>
        <option>Zimbabwe</option>

      </select>
    </li>


    <li><label for="zip">ZIP Code:</label></li>
    <li><input type="text" name="zip" /></li>

    <li><label for="email">Email:</label></li>
    <li><input type="text" name="email" size="50" /></li>

    <li><label id="gender">Sex:</label></li>
    <li><input type="radio" name="sex" value="Male" /><span>Male</span></li>
    <li><input type="radio" name="sex" value="Female" /><span>Female</span></li>

    <li><label>Language:</label></li>
    <li><input type="checkbox" name="en" value="en" checked /><span>English</span></li>
    <li><input type="checkbox" name="nonen" value="noen" /><span>Non English</span></li>

    <li><label for="desc">About:</label></li>
    <li><textarea name="desc" id="desc"></textarea></li>

    <li><input type="submit" name="submit" value="Submit" /></li>

  </ul>
</form>

<body>
</body>

</html>

После полного заполнения формы, когда я нажимаю кнопку отправки, отображается проверка радиокнопки, которая выбирает мужчина или женщину, но она уже выбрана ранее и когда я нажимаю ОК в предупреждении все введенные мной данные будут удалены, пожалуйста, помогите.

Я вставил файлы. js. css и. html, пол находится в последнем разделе, пожалуйста, проверьте один раз. Я не понимаю, что пошло не так.

1 Ответ

1 голос
/ 02 августа 2020

пара мелких проблем. Вам нужно вернуть true, если все тесты пройдены. Кроме того, не уверен, что делает регистрация, но при изменении на getElementById все выглядит хорошо. 

function validation()
{
var uid = document.registration.userid;
var passid = document.registration.passid;
var uname = document.registration.name;
var uadd = document.registration.address;
var ucountry = document.registration.country;
var uzip = document.registration.zip;
var uemail = document.registration.email;
var umsex = document.getElementById('male');
var ufsex = document.getElementById('female');

if(userid_validation(uid,5,12)){
   if(passid_validation(passid,7,12)){
      if(allLetter(uname)){
         if(alphanumeric(uadd)){ 
            if(countryselect(ucountry)){
               if(allnumeric(uzip)){
                  if(ValidateEmail(uemail)){
                     if(validsex(umsex,ufsex)){
                        return true;
                     }
                  } 
                }
             } 
          }
       }
    }
 }
return false;
}

function userid_validation(uid,mx,my)
{
var uid_len = uid.value.length;
if (uid_len == 0 || uid_len >= my || uid_len < mx)
{
alert("User Id should not be empty or length should be between "+mx+" to "+my);
uid.focus();
return false;
}
return true;
}


function passid_validation(passid,mx,my)
{
var passid_len = passid.value.length;
if (passid_len == 0 ||passid_len >= my || passid_len < mx)
{
alert("Password should not be empty or length should be between "+mx+" to "+my);
passid.focus();
return false;
}
return true;
}

function allLetter(uname)
{ 
var letters = /^[A-Za-z ]+$/;
if(uname.value.match(letters))
{
return true;
}
else
{
alert('Name must have alphabet characters only');
uname.focus();
return false;
}
}

function alphanumeric(uadd)
{ 
var letters = /^[0-9a-zA-Z]+$/;
if(uadd.value.match(letters))
{
return true;
}
else
{
alert('User address must have alphanumeric characters only');
uadd.focus();
return false;
}
}

function countryselect(ucountry)
{
if(ucountry.value == "Default")
{
alert('Select your country from the list');
ucountry.focus();
return false;
}
else
{
return true;
}
}

function allnumeric(uzip)
{ 
var numbers = /^[0-9]+$/;
if(uzip.value.match(numbers))
{
return true;
}
else
{
alert('ZIP code must have numeric characters only');
uzip.focus();
return false;
}
}


function ValidateEmail(uemail)
{
var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
if(uemail.value.match(mailformat))
{
return true;
}
else
{
alert("You have entered an invalid email address!");
uemail.focus();
return false;
}
}


function validsex(umsex,ufsex){
  var  x=0;

   if(umsex.checked)x++;
   
    
   if(ufsex.checked)x++; 
   
   
   
if(x==0){
alert('Select Male/Female');
umsex.focus();
return false;
}
else
{
alert('Form Successfully Submitted');

return true;}
}
h1 {
margin-left: 400px;
}
form li {
list-style: none;
}

form {
    margin-left: 320px;
}

form ul li label{
float: left;
clear: left;
width: 100px;
text-align: right;
margin-right: 10px;
font-size: 18px;
font-weight: bold;

}

form ul li input, select, span {
float: left;
margin-bottom: 10px;
}

form textarea {
float: left;
width: 350px;
height: 200px;
}

[type="submit"] {
clear: left;
margin-left: 255px;
margin-top: 20px;
font-size:18px
}

p {
margin-left: 70px;
font-weight: bold;
}
<!DOCTYPE html>
<html>
<head>

<title> Exercise 4 (Registration Page) </title>
<link rel="stylesheet" href="E4.css">
<script src="E4.js"></script>
</head>
<h1>Registration Form</h1>
<form name='registration' onSubmit="return validation();">
<ul>
<li><label for="userid">User id:</label></li>
<li><input type="text" name="userid" size="12" /></li>

<li><label for="passid">Password:</label></li>
<li><input type="password" name="passid" size="12" /></li>

<li><label for="name">Name:</label></li>
<li><input type="text" name="name" size="50" /></li>

<li><label for="address">Address:</label></li>
<li><input type="text" name="address" size="50" /></li>

<li><label for="country">Country:</label></li>
<li><select name="country">

<option selected="" value="Default">(Please select a country)</option>
<option>Australia</option>
<option>Afghanistan</option>
<option>Brazil</option>
<option>China</option>
<option>Canada</option>
<option>Denmark</option>
<option>Egypt</option>
<option>France</option>
<option>Germany</option>
<option>India</option>
<option>Japan</option>
<option>Korea</option>
<option>Madagascar</option>
<option>Malaysia</option> 
<option>Nepal</option>
<option>New Zealand</option>
<option>Nigeria</option>
<option>Philippines</option>
<option>Qatar</option>
<option>Russia</option>
<option>Saudi Arabia</option>
<option>Serbia</option>
<option>Singapore</option>
<option>South Africa</option>
<option>Spain</option>
<option>Turkey</option>
<option>USA</option>
<option>Yemen</option>
<option>Zimbabwe</option>

</select></li>


<li><label for="zip">ZIP Code:</label></li>
<li><input type="text" name="zip" /></li>

<li><label for="email">Email:</label></li>
<li><input type="text" name="email" size="50" /></li>

<li><label id="gender">Sex:</label></li>
<li><input id='male' type="radio" name="sex" value="Male" /><span>Male</span></li>
<li><input id='female' type="radio" name="sex" value="Female" /><span>Female</span></li>

<li><label>Language:</label></li>
<li><input type="checkbox" name="en" value="en" checked /><span>English</span></li>
<li><input type="checkbox" name="nonen" value="noen" /><span>Non English</span></li>

<li><label for="desc">About:</label></li>
<li><textarea name="desc" id="desc"></textarea></li>

<li><input type="submit" name="submit" value="Submit" /></li>

</ul>
</form>

<body>
</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...