x-editable : turn off inline editing for non admin users

Question

I am using X-Editable plugin for inline editing with angular.js In-line editing is working perfect. But, I want to disable this feature for non-admin users.

HTML:

<div ng-controller="OnaftersaveCtrl">
   <a href="#" editable-text="user.name" onaftersave="updateUser()">
   {{ user.name || 'empty' }}
   </a>
</div>

JS:

var app = angular.module("app", ["xeditable"]);
app.run(function(editableOptions) {
  editableOptions.theme = 'bs3'; // bootstrap3 theme. Can be also 'bs2', 'default'
});

app.controller('OnaftersaveCtrl', function($scope, $http) {
$scope.user = {
  id: 1,
  name: '<?=$test?>'
};

$scope.updateUser = function() {
    $http({
        method: 'post',
        url: '/test',
        data: $scope.user,
        headers: {'Content-Type': 'application/x-www-form-urlencoded'},
      }).
      success(function(response) {
          alert(response);
      }).
      error(function(response) {
          alert("not ok");
      });
      return false;
    };

});

I tried to putting html code in the id.

$('#myselector').editable('option', 'disabled', true);

But, It's not rendering the initial value. (here it's test variable which is coming from php).

Answer 1

I need to have the same functionality, I found a few issues on https://github.com/vitalets/angular-xeditable/pull/206 , but non of them wore fixed. I had to finish fast my task so I choose to replace the element with anotherone that dosent have the editable atributs.

 <i> <span ng-if="accounts.editOptions.isEditable" editable-text="account.clientCompanyXMLEntity.industry" ng-bind="account.clientCompanyXMLEntity.industry || 'add industry'"></span> <span ng-if="!accounts.editOptions.isEditable" ng-bind="account.clientCompanyXMLEntity.industry || 'add industry'"></span> </i> 

And in my controller I have:

 $scope.accounts.editOptions.isEditable = false; $scope.accounts.editOptions.toggleEditability = function() { $scope.accounts.editOptions.isEditable = !$scope.accounts.editOptions.isEditable; };