http://vitalets.github.io/angular-xeditable/#text-simple

ng-repeat="user in users" e-rows="7" e-cols="40" e-style="color: green" buttons="no" onaftersave <form editable-form name="editableForm" onaftersave="saveUser()"> or e-form="rowform"

<span editable-text="user.name" onbeforesave="checkName($data)"> onbeforesave="checkName($data, user.id)"

{

{ user.name || 'empty' }}

</span>

<span editable-select="user.status" e-ng-options="s.value as s.text for s in statuses">

{

{ showStatus(user) }}

</span>

-----------------

<a href="#" editable-select="user.group" οnshοw="loadGroups()" e-ng-options="g.id as g.text for g in groups">

{

{ user.groupName || 'not set' }}

</a>

$scope.groups = [];

$scope.loadGroups = function() {

return $scope.groups.length ? null : $http.get('/groups').success(function(data) {

$scope.groups = data;

});

-----------

$scope.users = [

{id: 1, name: 'awesome user1', status: 2, group: 4, groupName: 'admin'},

{id: 2, name: 'awesome user2', status: undefined, group: 3, groupName: 'vip'},

{id: 3, name: 'awesome user3', status: 2, group: null}

];

$scope.statuses = [

{value: 1, text: 'status1'},

{value: 2, text: 'status2'},

{value: 3, text: 'status3'},

{value: 4, text: 'status4'}

];

$scope.showStatus = function(user) {

var selected = [];

if(user.status) {

selected = $filter('filter')($scope.statuses, {value: user.status});

}

return selected.length ? selected[0].text : 'Not set';

};

$scope.checkName = function(data) {

if (data !== 'awesome') {

return "Username should be `awesome`";

}

};

<a href="#" editable-checkbox="user.remember" e-title="Remember?">

{

{ user.remember && "Remember me!" || "Don't remember" }}

</a>

<a href="#" editable-checklist="user.status" e-ng-options="s.value as s.text for s in statuses">

{

{ showStatus() }}

</a>

$scope.statuses = [

{value: 1, text: 'status1'},

{value: 2, text: 'status2'},

{value: 3, text: 'status3'}

];

$scope.showStatus = function() {

var selected = [];

angular.forEach($scope.statuses, function(s) {

if ($scope.user.status.indexOf(s.value) >= 0) {

selected.push(s.text);

}

});

return selected.length ? selected.join(', ') : 'Not set';

};

<a href="#" editable-radiolist="user.status" e-ng-options="s.value as s.text for s in statuses">

{

{ showStatus() }}

</a>

$scope.statuses = [

{value: 1, text: 'status1'},

{value: 2, text: 'status2'}

];

$scope.showStatus = function() {

var selected = $filter('filter')($scope.statuses, {value: $scope.user.status});

return ($scope.user.status && selected.length) ? selected[0].text : 'Not set';

};

 

<a href="#" editable-bsdate="user.dob" e-datepicker-popup="dd-MMMM-yyyy">

{

{ (user.dob | date:"dd/MM/yyyy") || 'empty' }}

</a>

app.controller('Ctrl', function($scope, $filter) {

$scope.user = {

dob: new Date(1984, 4, 15)

};