Как я могу сделать свою ошибку в моем зарезервированном разделе?

В зарезервированной области я хочу показать ошибки, которые будут отображаться, если что-то не пойдет правильно с помощью ввода. Одно из предпосылок, которые у меня есть, - это то, что должно быть какое-то значение в пределах имени. Если нет значения, в пределах зарезервированного следует указать «Имя должно быть заполнено». Как я могу сделать свою ошибку в моем зарезервированном разделе?

На данный момент у меня есть предупреждение, которое появляется, если имя не заполнено.

Как я могу совершать ошибки в разделе «Зарезервировано»?

JS:

function validateForm() 
{ 
    var x = document.forms["application"]["fName"].value; 

    if (x == null || x == "") 
    { 
     alert("Name must be filled out"); 
     return false; 
    } 
}

HTML:

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <meta charset="UTF-8" /> 
     <title>int222_162d16 - Assignment 3 - Home Page</title> 
     <link rel="stylesheet" href="css/normalize.css" type="text/css" media="screen" /> 
     <link rel="stylesheet" href="css/sitecss.css" type="text/css" media="screen" /> 
     <script src='javascript/myscript.js' type='text/javascript'></script> 
    </head> 
    <body> 
     <form name="application" id="application" method="post" action="https://zenit.senecac.on.ca/~emile.ohan/cgi-bin/cardApplication.cgi" onsubmit="return validateForm();"> 
     <fieldset> 
     <legend class="t"><img src="https://zenit.senecac.on.ca/~emile.ohan/int222/bank-logo.png" alt="Assignment #3" />Seneca Bank - Credit Card Application</legend> 

      <div class="clearfix"> 
      <aside class="l"> 
      <fieldset> 
      <legend>Primary Applicant's Information</legend> 

      <table> 
       <tr> 
        <td>First Name*</td>  
        <td><input type="text" name="fName" id="fName" size="20" maxlength="20" autofocus="autofocus" ></td> 
       </tr> 
       <tr> 
        <td>Surname*</td> 
        <td><input type="text" name="sName" id="sName" size="20" maxlength="30"></td> 
       </tr> 
       <tr> 
        <td>Date of Birth*</td>  
        <td><input type="text" name="dob" id="dob" size="10" placeholder="MMMYYYY" maxlength="7"></td> 
       </tr> 
       <tr> 
        <td>Email Address*</td>  
        <td><input type="text" name="email" id="email" size="20" maxlength="60"></td> 
       </tr> 
       <tr> 
        <td>Phone No.*</td>  
        <td><input type="text" name="phone" id="phone" size="20" maxlength="12"></td> 
       </tr> 
      </table> 
      </fieldset> 
      </aside> 

      <section class="s"> 
      <fieldset> 
      <legend>Primary Applicant's Address</legend> 
      <table> 

       <tr> 
        <td>Home Address*</td> 
        <td>Apt.</td> 
       </tr> 
       <tr> 
        <td><input type="text" name="address" id="address" size="30" maxlength="60"></td> 
        <td><input type="text" name="apt" id="apt" size="5" maxlength="4"></td> 
       </tr> 

       <tr> 
        <td><br />City* </td> 
       </tr> 
       <tr> 
        <td><input type="text" name="city" id="city" size="20" maxlength="40"> 
       </tr> 
       <tr> 
        <td><br />Province*</td> 
        <td><br />Postal Code</td> 
       </tr> 
       <tr> 
        <td> 
         <select id="province" name="province" size="2"> 
          <optgroup label="Province"> 
           <option value="Alberta">Alberta</option> 
           <option value="British Columbia">British Columbia</option> 
           <option value="Manitoba">Manitoba</option> 
           <option value="New Brunswick">New Brunswick</option> 
           <option value="Newfoundland & Labrador">Newfoundland & Labrador</option> 
           <option value="Nova Scotia">Nova Scotia</option> 
           <option value="Ontario">Ontario</option> 
           <option value="Prince Edward Island">PE</option> 
           <option value="Quebec">Quebec</option> 
           <option value="Saskatchewan">Saskatchewan</option> 
          </optgroup> 
          <optgroup label="Territory"> 
           <option value="Northwest Territories">Northwest Territories</option> 
           <option value="Nunavut">Nunavut</option> 
           <option value="Yukon">Yukon</option> 
          </optgroup> 
         </select> 
        </td> 
        <td> 
         <input type="text" name="postal" id="postal" size="8" maxlength="7" placeholder="ANA NAN"> 
        </td> 
       </tr> 
      </table> 
      </fieldset> 
      </section> 

      <aside class="r"> 
      <fieldset> 
      <legend>Housing Status</legend> 

      <table> 
       <tr> 
        <td>Do you:</td> 
        <td>$Monthly Payment* </td> 
       </tr> 
       <tr> 
        <td><input type="checkbox" name="hStatus" id="s01" value="Own" />Own the property</td> 

        <td><input type="text" name="payment" id="payment" size="8" maxlength="6"></td> 
       </tr> 
       <tr> 
        <td><input type="checkbox" name="hStatus" id="s02" value="Rent" />Rent the property</td> 
       </tr> 
       <tr> 
        <td>Monthly Income*</td> 
        <td><input type="text" name="income" id="income" size="8" maxlength="6"></td> 
       </tr> 
       <tr> 
        <td>Years at current location*</td> 
        <td><input type="text" name="currYears" id="currYears" size="3" maxlength="2"></td> 
       </tr> 
       <tr> 
        <td>Pre-authorized Code*</td> 
        <td><input type="text" name="preCode" id="preCode" size="8"></td> 
       </tr> 
      </table> 
      </fieldset> 
      </aside> 
      </div> 

      <div class="clearfix"> 
      <section class="s"> 
       <fieldset> 
       <legend>Reserved - See below</legend> 
        <p><b>If you submit your application with errors and/or omissions, a list of errors and/or omissions will show here. Make the corrections and re-submit.</b></p> 
        <p><b>If you continue to have a problem submitting your application, make a note of the Reference No. and call us at 1-800-010-2000.</b></p> 

        <script>document.write</script> 
       </fieldset> 
      </section> 

      <aside class="l"> 
      <fieldset> 
      <legend>Credit Check/Email Consent</legend> 
       <p><b>I consent to have a credit check performed</b></p> 
       <input type="checkbox" class="BoxCheck" name="creditCheck" id="c01" value="Yes" onclick="check(this);" />Yes 
       <input type="checkbox" class="BoxCheck" name="creditCheck" id="c02" value="No" onclick= "check(this);" />No 
       <br />           

       <p><b>I consent to have email messages sent to me</b></p> 
       <input type="radio" name="emailConsent" id="m01" value="Yes" />Yes 
       <input type="radio" name="emailConsent" id="m02" value="No" />No 
       <br />           
       Submitted on: 

       <script> 
        var d = new Date(); 
        document.write(d.toDateString()); 
       </script> 

       &ensp; &ensp; Ref. #     <input type="text" name="refNo" id="refNo" size="8" readonly="readonly"> <br /> 
       <!--Submit Application--> <input type="submit" value="Submit Application"> 
       <!--Start Over-->   <input type="reset" value="Start Over"> 
              <input type="hidden" name="hName" id="hName" value="Mahmood"> <br /> 
              <input type="hidden" name="hId" id="hId" value="int222_162d16"> <br /> 
      </fieldset> 
      </aside> 

      </div> 



     </fieldset> 
     </form> 


     <footer class=f> 
      <a href="../">My zenit Account</a> <a href="javascript/">My JavaScript</a> <a href="css/">My CSS</a> <a href="honesty.html">My Honesty</a> 
      <script> 
       var dt=new Date(document.lastModified); // Get document last modified date 
       document.write('<p>This page was last updated on '+dt.toLocaleString()) + '</p>'; 
      </script> 
     </footer> 
    </body> 
</html>

источник

2016-08-06 Asad Mahmood

Как использовать HTML5 Я рекомендую API Javascript Constraint одобрению и требуется, и шаблон атрибутов для входных элементов. API проверки ограничений - это собственный HTML5/Javascript. С API вы можете реагировать и отображать все ошибки там, где хотите. – Marcel

Вариант 1: Вы можете использовать "необходимую" собственность на вашем входе.
Вариант 2:

1- Создать DIV со стилем = "дисплеем: NONE", где когда-либо вам нравится в вашем йоте и присвоить идентификатор этого дела. IE:

<div id="err1" style="display:none"></div>

2- В вашем JavaScript, об ошибке:

if (x == null || x == "") 
{ 
    var errDiv = document.getElementById("err1"); 
    errDiv.innerHTML = "Please fill input"; 
    errDiv.style.display = 'block'; 

    return false; 
}

источник

2016-08-06 18:33:49 TestCandidate

Если я вас правильно понимаю, просто добавьте <span> элемент к вашему <section class="s">. Дайте пролете идентификатор, как «err_log» или просто «ERR» и использовать это для вывода ошибка

function validateForm() 
{ 
    var x = document.forms["application"]["fName"].value; 

    if (x == null || x == "") 
    { 
     alert("Name must be filled out"); 
     document.getElementById('youridofthespan').innerHTML='Name must be filled out'; 
     return false; 
    }else{ 
     document.getElementById('youridofthespan').innerHTML=''; 
    } 
}

Если вы хотите, чтобы показать и удалить несколько ошибок, вы можете просто создать на пролете для каждой ошибки и сделать выше использовать их.

Надеется, что это помогает :)

источник

2016-08-06 18:30:17 RPaul

Как я могу сделать свою ошибку в моем зарезервированном разделе?

ответ

Смежные вопросы