Angular-xeditable

It is based on ideas of x-editable but was written from scratch to use power of angular and support complex forms / editable grids.

Edit Text

To make element editable via textbox just add editable-text="model.field" attribute.

Select Local

To create editable select (dropdown) just set editable-select attribute pointing to model. To pass dropdown options you should define e-ng-options attribute that works like normal angular ng-options but is transfered to underlying <select> from original element.

Select Remote

To load select options from remote url you should define onshow attribute pointing to scope function. The result of function should be a $http promise, it allows to disable element while loading.

Textarea

To make element editable via textarea just add editable-textarea attribute pointing to model in scope. You can also wrap content into <pre> tags to keep linebreaks. Data can be submitted by Ctrl + Enter.

Checkbox

To make element editable via checkbox just add editable-checkbox attribute pointing to model in scope. Set e-title attribute to define text shown with checkbox.

Checklist

To create list of checkboxes use editable-checklist attribute pointing to model. Also you should define e-ng-options attribute to set value and display items.

Radiolist

To create list of radios use editable-radiolist attribute pointing to model. Also you should define e-ng-options attribute to set value and display items. By default, radioboxes aligned horizontally.

Validate

Validation is performed via onbeforesave attribute pointing to validation method. Value is available as $data parameter. If method returns string - validation failed and string shown as error message.

Hide buttons

To hide Ok and Cancel buttons you may set buttons="no" attribute. New value will be saved automatically after change.

Select multiple

Just define e-multiple attribute that will be transfered to select as multiple .