Easy Money
Easy Money

Reputation: 527

Disable button base on the json value

so I have a json object and also a edit button. I am wondering how to disable that edit button if the value is not equal to Peter so that the user cannot edit it.

angular.module('app')

.factory('WebApi', function () {

//Dummy Data
var name = [{
        value: "Peter",
        text: "Peter"
    }, {
        value: "John",
        text: "John"
    }, {
        value: "Lucy",
        text: "Lucy",
    }, {
        value: "Hawk",
        text: "Hawk"
    }];

var tempData = [];

//Display 100 item 
for (var i = 0; i < 100; i++) {

    var selectedName = name[Math.floor((Math.random() * name.length))];

   tempData.push({
     name: selectedName.text


    })
};

constants.js

angular.module('app')

.factory('Constants', function () {

    return {
        status: {
            Peter: 'Peter'
        }
    };

});

button

 <ion-list can-swipe="listCanSwipe">
                            <ion-item ng-repeat="data in tempData"
                                      item="data">
                              Name: {{data.name}}

                                <ion-option-button class="button-calm"
                                                   ng-click="edit(data)">
                                    Edit
                                </ion-option-button>

                            </ion-item>

                        </ion-list>

Upvotes: 1

Views: 1048

Answers (3)

Nikhil Aggarwal
Nikhil Aggarwal

Reputation: 28455

Use ng-disabled like following

<ion-option-button ng-disabled="data.name!='peter'" class="button-calm"ng-click="edit(data)">
      Edit
  </ion-option-button>

For reference - https://docs.angularjs.org/api/ng/directive/ngDisabled

Upvotes: 1

atinder
atinder

Reputation: 2090

In Html

 ng-disabled="someFunction()"

In your JS

$scope.someFunction = function() {

 // return true or false.

};

Upvotes: 0

Ved
Ved

Reputation: 12093

Use ng-disabled: Examlpe:-

<ion-option-button ng-disabled="name.value!='peter'" class="button-calm"ng-click="edit(data)">
      Edit
  </ion-option-button>

Upvotes: 1

Related Questions