在angularJS中单击一次后禁用提交按钮

时间:2016-07-27 16:24:01

标签: angularjs button angularjs-ng-disabled

我想在点击一下后禁用按钮。

代码:

<button id="submitRequest" class="btn btn-primary btn-active"
        ng-disabled="!frmRequest.$valid||!r.DataUseAgreement||(!chkBMT&&!chkOncore&&!chkCAISIS&&!chkLIMS&&!chkFCR)"
        ng-click="SaveData()">
  <i class="fa fa-save"></i> Submit
</button>

如何在一次点击后禁用此功能?

谢谢!

4 个答案:

答案 0 :(得分:5)

简单。你写了一些javascript的元素,比如onclick="this.disabled=true"

&#13;
&#13;
<button id="submitRequest" onclick="this.disabled=true" class="btn btn-primary btn-active" ng-disabled="!frmRequest.$valid||!r.DataUseAgreement||(!chkBMT&&!chkOncore&&!chkCAISIS&&!chkLIMS&&!chkFCR)" ng-click="SaveData()"><i class="fa fa-save"></i> Submit</button>
&#13;
&#13;
&#13;

答案 1 :(得分:4)

点击一下后停用按钮

<input type="submit" name="Submit" class="btn btn-primary"
value="Submit" ng-disabled="button.disabled"/>

在Controller中,您只需添加

提交表单
scope.button={};
scope.button.disabled=true;

这会在一次单击表单提交后禁用该按钮

答案 2 :(得分:1)

在SaveData()函数中,在函数开头添加以下行:

$scope.saving=true;

然后,在您的ng禁用条件下,添加其他条件:

saving||!frmRequest.$valid||!r.DataUseAgreement||(!chkBMT&&!chkOncore&&!chkCAISIS&&!chkLIMS&&!chkFCR)

答案 3 :(得分:0)

It is quite straight forward. You just have to add one more Boolean condition in your ng-disable statement.

 <button class="btn btn-info" ng-click="ctrl.isSubmit()" ng-disabled="ctrl.submitClicked">Submit</button>

And in your Controller

var vm=this;
vm.submitClicked=false;

vm.isSubmit= function(){
vm.submitClicked= true;
}

Here is a Plunker that I made for you