2016-06-02 14 views
0

Ich lerne angularjs und benutze ng-show mit formvalidierung, aber es funktioniert nicht. Ich habe form name.input's name. $ Error & &! Forms name.input der name. $ Pristine auf meine fehlermeldung span aber es ist nur fehlgeschlagen und keine fehlermeldung ausgegeben. Ich habe auch versucht, den Wert von user_form.username. $ Pristine zu sehen, und nichts passiert. Keine Fehlermeldung auf der Konsole angezeigt. Kannst du mir bitte helfen, den Grund zu finden?

  <form id="user_form" name="user_form" ng-submit="register()" novalidate> 
       <table> 
        <tr> 
         <td class="area"> 
          <div class="area"> 
           <select> 
            <option value="">Area</option> 
            <option value="Australia">+61</option> 
           </select> 
          </div> 
         </td> 
         <td> 
          <div class="mobile"> 
           <span><input name="mobileNum" id="mobileNum" type="text" placeholder="Your Mobile Number" class="mobile" ng-model="user.mobile" ></span> 
          </div> 
          <span ng-show="user_form.mobileNum.$error.required && !user_form.mobileNum.$pristine">Mobile number is required</span> 
         </td> 
        </tr> 
        <tr> 
         <td colspan="2"> 
          <span class="name"><input type="name" name="username" placeholder="Your Name" class="name" ng-model="user.name"></span> 
          <span ng-show="user_form.username.$error.required && !user_form.username.$pristine">Mobile number is required</span> 
          {{user_form.username.$pristine}} 
         </td> 
        </tr> 
        <tr> 
         <td colspan="2"><span class="passward"><input type="password" placeholder="Passward" class="pw" ng-model="user.password"></span></td> 
        </tr> 
        <tr> 
         <td colspan="2" class="terms"> 
          <form action="#" method="post"> 
           <input type="checkbox" name="agree" value="1" class="terms" id="check-box"> 
           <label for="check-box"><a target="new" href="pdf/Terms_and_conditions_16may2016.pdf">Terms And Conditions</a></label> 
          </form> 
         </td> 
        </tr> 
        <tr class="create"> 
         <td colspan="2"><span><input type="submit" value="Create A New Account" class="create" ng-disabled="user_form.$invalid"></span></td> 
        </tr> 
       </table> 
      </form> 

Antwort

3

Sie sollten required für hinzufügen.

Wechsel:

<input name="mobileNum" id="mobileNum" type="text" placeholder="Your Mobile Number" class="mobile" ng-model="user.mobile" > 

An:

<input name="mobileNum" id="mobileNum" type="text" placeholder="Your Mobile Number" class="mobile" ng-model="user.mobile" required> 

für alle Eingänge anwenden.

1

Sie müssen angeben, welche Art von Validierungen Sie in Ihrer Eingabe vornehmen möchten.
In Ihrem Fall ist nur required. also festlegen, dass Ihre Eingabe

<input required name="mobileNum" id="mobileNum" type="text" placeholder="Your Mobile Number" class="mobile" ng-model="user.mobile" > 

Check this plunker

Eckige Form Validierungsdokumentation erforderlich: https://docs.angularjs.org/guide/forms

Verwandte Themen