CODEWITHSUNDEEP
javascripthtmlangularjsbuttoncontroller
ntj
ntj

Reputation: 335

Enable a button dynamically

I have an empty array, upon page load, since there are no values stored in this array, I disabled the button using ng-disabled="array1.length==0". In the page that opens up I have four drop downs present. What I am trying to achieve is the button should be enabled when I select even one option of the four drop downs.

But just by adding the ng-disabled to the button does not calculated the length of the array dynamically.

I have declared array1= [{name1:''}, {name2:''}, {name:''}]. I just figured out that the length will never be 0. I want the button to be disable when the values are '' and enabled once user selects a value.

The fields present in the page are configurable, So all the four fields that I show by default in the page, come under one model. ng-model="model[value.Name]" This will give me the four drop downs (I do a ng-repeat).So I cannot add a hard coded value to the ng-disabled as they are dynamic values.

Any suggestions on how do I get this done?

Upvotes: 0

Views: 100

Answers (3)

ismail baig
ismail baig

Reputation: 891

find my answer. i hope your array format is to be changed as array on json as shown in controller.

$scope.myarray = [{name:''},{name:'name2'},{name:'name3'}];

html 

<body ng-app='myApp' ng-controller='myCtrl'>
 <button ng-disabled="!selectedName.name && !selectedName2.name" '>button</button>

<select ng-model="selectedName" ng-options="x.name for x in myarray"></select>
   <select ng-model="selectedName2" ng-options="x.name for x in myarray"></select>
</body>

controller 

var app = angular.module("myApp", []);

angular
.module('myApp')
.controller('myCtrl', ['$scope',
    function ($scope) {
$scope.myarray = [{name:''},{name:'name2'},{name:'name3'}];            
    }]);

please find the plunker Plnkr link

Upvotes: 0

VjyV
VjyV

Reputation: 334

Please try with that ng-disabled='ddl1 || ddl2 || dd3 || dd4' !!!

Upvotes: 1

Igor Janković
Igor Janković

Reputation: 5532

You should have ng-disabled="!value1 && !value2 && !value3 && !value4 Where value1, value2, value3, value4 represents ng-model's of the mentioned dropdowns. In case that some of those dropdown values has a selected value button should be enabled.

Upvotes: 1

Related Questions