How to disabled button on Angular

Question

this first part working fine.

<div ng-app="" ng-init="mySwitchone=true">
<p>
    <button ng-disabled="mySwitchone">Click Me!</button>
</p>
<p>
    <input type="checkbox" ng-model="mySwitchone"/>Button
</p>
<p>
{{ mySwitchone }}
</p>
</div>

But do not work on second part. What's wrong with this code. Can anyone tell me.

<div ng-app="" ng-init="myTest=true">

<p>
    <button ng-disabled="myTest"> Click me</button> 
</p>
<p>
    <input type="checkbox" ng-model="myTest"/>Button
</p>
<p>
    {{ myTest }}
</p>

</div>

No error in console. I want to work both part one html page. But first part work fine. but second part not work. — Max
– Max, Commented Aug 17, 2015 at 13:55
You have both div in the same page ? If yes, remove ng-app on the second div. You can't declare this multiple times. — Pierre-Alexandre Moller
– Pierre-Alexandre Moller, Commented Aug 17, 2015 at 13:58
@RejithRKrishnan aha I see. The problem is that you have multiple ng-app on one page. It can be solved by doing this. jsfiddle.net/b6yjgfvz/3 — Johan Brännmar
– Johan Brännmar, Commented Aug 17, 2015 at 13:59

Bipon Biswas · Accepted Answer · 2015-08-17 14:14:58Z

2

First problem you can use multiple ng-app. Try this bellow way

<!DOCTYPE html>
<html ng-app="">
<body>


<div  ng-init="mySwitchone=true">
<p>
    <button ng-disabled="mySwitchone">Click Me!</button>
</p>
<p>
    <input type="checkbox" ng-model="mySwitchone"/>Button
</p>
<p>
{{ mySwitchone }}
</p>
</div>

<div  ng-init="myTest=true">

<p>
    <button ng-disabled="myTest"> Click me</button> 
</p>
<p>
    <input type="checkbox" ng-model="myTest"/>Button
</p>
<p>
    {{ myTest }}
</p>

</div>


</body>
</html>

edited Aug 17, 2015 at 14:14

answered Aug 17, 2015 at 14:09

Bipon Biswas

11.7k1 gold badge30 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

James Over a year ago

Linking to w3schools is generally a poor resource, linking to docs.angularjs.org/api/ng/directive/ngApp or some better resource would be much more helpful.

Rachitta A Dua · Accepted Answer · 2015-08-17 14:06:16Z

1

This is how your code needs to be-

<div ng-app="" ng-init="mySwitchone=true;myTest=true">
<p>
<button ng-disabled="mySwitchone">Click Me!</button>
</p>
<p>
<input type="checkbox" ng-model="mySwitchone"/>Button
</p>
<p>
{{ mySwitchone }}
</p>

<p>
<button ng-disabled="myTest"> Click me</button> 
</p>
<p>
<input type="checkbox" ng-model="myTest"/>Button
</p>
<p>
{{ myTest }}
</p>

</div>

answered Aug 17, 2015 at 14:06

Rachitta A Dua

3581 silver badge11 bronze badges

Collectives™ on Stack Overflow

How to disabled button on Angular

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related