{{ mainTitle }}

Angular-xeditable is a bundle of AngularJS directives that allows you to create editable elements. Such technique is also known as click-to-edit or edit-in-place.
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.

Date

Set editable-bsdate attribute in editable element. Other parameters can be defined via e-* syntax, e.g. e-datepicker-popup="dd-MMMM-yyyy".