Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Disable submit button after one click in angularJS

I would like to disable button after one click.

Code:

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

How to disable this one after one click?

Thanks!

like image 804
sravs17991 Avatar asked Jul 27 '16 16:07

sravs17991


People also ask

How to disable the button after one click in AngularJS?

Simple. You write to element a bit of javascript, like onclick="this. disabled=true" . This will disable the button one click,but it doesnt allow form submission too for first click.

How to hide button after click in Angular?

How do you hide a button after it is clicked in angular? First set up a Boolean variable for the show hide like public show:boolean = false. Next, set up a function that is tied to the click event of a button or some event on the dom.

How do you use NG disability?

Definition and UsageThe ng-disabled directive sets the disabled attribute of a form field (input, select, or textarea). The form field will be disabled if the expression inside the ng-disabled attribute returns true. The ng-disabled directive is necessary to be able to shift the value between true and false .


2 Answers

Simple. You write to element a bit of javascript, like onclick="this.disabled=true" .

<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>
like image 69
EddNewGate Avatar answered Dec 10 '22 16:12

EddNewGate


Disabling button after one click

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

In Controller,where u submit the form just add

scope.button={};
scope.button.disabled=true;

This disables the button after one click form submission

like image 34
Hema Avatar answered Dec 10 '22 17:12

Hema