2016-06-28 3 views
0

Ich schreibe ein einfaches Formular, wo ich das Formular Ergebnis in ein Array speichern möchten, wobei sowohl der Vorname als auch der Nachname aktualisiert, wenn eines oder beide Felder leer sind sollte eine Warnmeldung ausgeben. Und das Array sollte keine leeren Werte speichern und ich wollte dies auf der Clientseite behandeln. Ich bin etwas verwirrt, wie man die Eingabewerte überprüft, bevor man sie speichert. Hier ist der Code-Schnipsel: https://jsbin.com/guduwakeji/edit?html,js,outputÜbernehmen Validierung für Formularfelder Client-Seite mit Winkel

var app = angular.module('myApp', []); 
 
app.controller('formCtrl', function($scope) { 
 
    $scope.ele = []; 
 
    $scope.updateDetails = function(ele) { 
 
    if (!ele.firstname && !ele.lastname) { 
 
     alert("Ele cannot be empty"); 
 
    } else { 
 
     ele.push({ 
 
     'firstname': '', 
 
     'lastname': '' 
 
     }); 
 
     alert(ele.firstname + " " + ele.lastname); 
 
    } 
 
    console.log(ele); 
 
    }; 
 

 
});
<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
</head> 
 

 
<body ng-app="myApp"> 
 
    <div ng-controller="formCtrl"> 
 
    <div> 
 
     First Name: 
 
     <input type="text" ng-model="ele.firstname"> 
 
     </br> 
 
     Last Name: 
 
     <input type="text" ng-model="ele.lastname"> 
 
     <br/> 
 
     <input type="button" value="Submit" ng-click="updateDetails(ele)"> 
 
    </div> 
 
    </div> 
 
</body> 
 

 
</html>

+0

Bitte fügen Sie den entsprechenden Code selbst hinzu. –

+0

Verwenden Sie 'ng-pristine', 'ng-dirty', 'ng-valid', 'ng-invalid' –

Antwort

0

Verwendung dieser Code

ich auf diese Weise herauszufinden, zu validieren Ihre Form

var app = angular.module('myApp', []); 
app.controller('formCtrl', function($scope) { 
    $scope.ele={}; 
    $scope.updateDetails = function(ele){ 
    if(ele.firstname && ele.lastname) 
    { console.log(ele);} 
     else{ 
     alert("empty field not allowed"); 
     } 
    }; 

}); 
+0

Ja, das funktioniert auch bei mir. Vielen Dank. Aber ich habe diesen Zweifel, können wir auch erforderliche Attribut im Eingabefeld richtig verwenden? Zusammen mit der Modellvalidierung. –

+0

es funktioniert nicht, weil es nicht HTML-Formular erforderlich ist nur Arbeit mit HTML-Formular hoffe, Sie haben es – uzaif

1

unten siehe Link, den Sie wird kommen zu wissen, wie es funktioniert und was Sie für Ihr Projekt tun sollten.

http://www.w3schools.com/angular/angular_validation.asp

Blick in diese Websites, die sie Ihnen helfen können.

https://docs.angularjs.org/guide/forms

+0

Ich kann mein Projekt nicht bewegen, um angular2, gibt es eine Möglichkeit, mit eckigen 1.x api –

+0

haben Sie meine Antwort überprüft? – uzaif

+0

Ich habe einen weiteren Link hinzugefügt können Sie in das @Ritu K –

Verwandte Themen