Wie eine Schaltfläche machen anklickbar nur, wenn das Textfeld eingegeben wird

hatte ich ein Textfeld die emailId..Iam eingeben diesen Wert in $rootScope.emailId gespeichert bekommen. Nun, wenn ich den Absenden-Button klicken, ich auf der nächsten Seite nehmen müssen nur dann, wenn die EMAILID eingegeben oder sonst muss es eine Warnung, die besagt, dass die ausgefüllt werden müssen. Derzeit ist es in Form ist, und ich bin mit required="true" und form.$valid aber noch funktioniert es nicht gibt es eine andere Möglichkeit, dies zu erreichen.Wie eine Schaltfläche machen anklickbar nur, wenn das Textfeld eingegeben wird

<form name="customerForm" class="form-horizontal"> 
    <div class="form-group"> 
     <label for="inputEmail" class="col-lg-4 col-lg-offset-1 control-label">Email address</label> 
     <div class="col-lg-4"> 
      <input class="form-control" ng-model="$root.customerDetails.eMail" placeholder="Enter customer email" type="email" required focus value="{{emailId}}"> 
     </div> 
    </div> 
</form>

<div class="col-lg-1"> 
    <button type="submit" class="btn btn-primary right-button" ng-click="$ctrl.proceedToPaymentDetails()" ng-disabled="$ctrl.customerDetails">Next</button> 
</div>

Derzeit ist die Form und die Taste nicht in dem gleichen html page..Is die eine Möglichkeit, dies zu beheben.

Quelle

2016-10-14 H Varma

Änderung ng-disabled="customerForm.$invalid" oder Sie können auch den Wert der E-Mail-ID in Ihrem proceedToPaymentDetails() -Methode für Warnmeldung prüfen.

Quelle

2016-10-14 11:25:15

ng-disabled ist this.I nicht im Zusammenhang entfernt, dass ... Wie die E-Mail-ID innerhalb der proceedToPaymentDetails überprüfen() –

Bitte gegangen throw dieses Beispiel-Code für Ihr besseres Verständnis

<!DOCTYPE html> 
<html lang="en"> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
<body> 

<div ng-app="myApp" ng-controller="formCtrl"> 
    <form novalidate> 
    First Name:<br> 
    <input type="text" ng-model="user.firstName"><br> 
    Last Name:<br> 
    <input type="text" ng-model="user.lastName"> 
    <br><br> 
     Email:<br> 
    <input type="text" ng-model="user.emailID"> 
    <br><br> 
    <button ng-click="proceedToPaymentDetails()">Next</button> 
    </form> 
    <p>form = {{user}}</p> 
</div> 

<script> 
var app = angular.module('myApp', []); 
app.controller('formCtrl', function($scope) { 
    $scope.user = {firstName:"", lastName:"",emailID:""}; 
    $scope.proceedToPaymentDetails = function() { 
     alert($scope.user.emailID); 
    }; 
}); 
</script> 

</body> 
</html>

Quelle

2016-10-17 10:52:28

Wie eine Schaltfläche machen anklickbar nur, wenn das Textfeld eingegeben wird

Antwort

Verwandte Themen