AngularJS Validation - ng-minlength on textarea

我正在開發一個AngularJS用於前端的項目。以下是我有：AngularJS Validation - ng-minlength on textarea

textarea with buttons underneath

的驗證規則我想有如下：

的Next按鈕應禁止，除非輸入的原因是至少10個字符。

此外，我希望能夠告訴用戶在他/她能夠提交之前剩下多少個角色。這將在textarea的右下角。

CODE：

<form name="paymentForm"> 
    <div class="form-group" id="Div2"> 
     <select ng-model="selectedPaymentStatus" ng-options="ps.name for ps in paymentStatus"></select> 
    </div><!-- .form_group --> 

    <div ng-show="selectedPaymentStatus.value === 'paymentDeferred'" class="form-group" id="Div3"> 
     <p>Reason</p> 
     <textarea class="form-control" ng-model="crate.paymentDeferredReason" ng-minlength="10"></textarea> 
    </div><!-- .form_group --> 
</form> 

<button class="btn wizard-next-btn pull-right" ng-disabled="paymentForm.$valid" ng-click="nextStep()">Next</button> 
<button class="btn wizard-back-btn" ng-click="previousStep()">Back</button>

出於某種原因，上面的代碼不工作！即使我輸入單個字符，也會啓用下一個按鈕！

任何幫助將不勝感激。

謝謝。

來源

2014-06-24 Ciwan

你'NG-禁用=「 paymentForm $有效」';它應該是相反的。此外，你確定這將與按鈕*外部*形式？ –

該按鈕似乎在窗體外工作;對上面的小修改：您還需要指定'ng-required =「true」'使空字段無效;否則'ng-minlength'似乎不會在空字段上生效。 [小提琴]（http://jsfiddle.net/J2JA6/） –

謝謝@NikosParaskevopoulos你可以請答覆作爲答覆嗎？你的建議修復了它。 :) – Ciwan

你需要做出兩處修改：

ng-disabled="paymentForm.$valid"實際上應該是ng-disabled="paymentForm.$invalid"
添加ng-required="true"到<textarea>;否則ng-minlength似乎不會對空字段生效。

此外，按鈕是在窗體外部似乎工作正常，但我會建議反對它;我有一種感覺它不會在所有情況下工作（但不能現在:)證明

相關小提琴：http://jsfiddle.net/J2JA6/

來源

2014-06-24 07:26:43

AngularJS Validation - ng-minlength on textarea

回答

相關問題