テキストフィールドが入力された場合にのみボタンをクリックできるようにする方法

私は電子メールIDを入力するテキストフィールドを持っていました。その値は$rootScope.emailIdに格納されています。送信ボタンをクリックすると、emailIdが入力された場合にのみ次のページに進む必要があります。そうでない場合は、記入する必要があるという警告が表示されます。現在のところ、それは形式であり、私はrequired="true"とform.$validを使用していますが、それでもなおこれを実現する方法はありません。テキストフィールドが入力された場合にのみボタンをクリックできるようにする方法

<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>

現在の形とボタンがこの問題を解決する方法をDER同じHTML page..Isではありません。

出典

2016-10-14 H Varma

変更ng-disabled="customerForm.$invalid"また、proceedToPaymentDetails（）メソッド内の電子メールIDの値で警告メッセージを確認することもできます。

出典

2016-10-14 11:25:15

NG-無効あなたのより良い理解のために、この例のコードは...どのようにproceedToPaymentDetails内部の電子メールIDをチェックすることを削除してください（） –

がなくなっスローがthis.Iに関連していない

<!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>

出典

2016-10-17 10:52:28

テキストフィールドが入力された場合にのみボタンをクリックできるようにする方法

答えて

関連する問題