Mtoypc
Mtoypc

Reputation: 494

How to change Angularjs xeditable text/textarea behavior?


I use angularjs and xeditable in my application. I would like to change the behaviour of editable textarea and editable text to allow the validation when the user click outside.
It will be better with an example :

<span editable-textarea="item.label.text" e-rows="2" e-cols="80" buttons="no" onshow="onShow()" onhide="onClose()">{{item.label.text}}</span>


With this code, we can't see the buttons to validate and to cancel our choice. Moroever the enter key doesn't validate, so it's impossible for the user to validate his choice.
What I want to do is changing the behaviour of the enter key to validate the new text. And I want to add the possibility for the user to change text and when he click outsite the textarea, the new text will be save.

The problem is I have no idea of how to do that even after reading all the documentation of xeditable and I didn't find the solution on any forum.

Do you have an idea of how can I do that ?

Thank you in advance

Upvotes: 4

Views: 1449

Answers (1)

Shingaz
Shingaz

Reputation: 108

You can add the blur attribute with submit value and couple it with onbeforesave attribute:

<span editable-textarea="item.label.text" e-rows="2" e-cols="80" buttons="no" onshow="onShow()" onhide="onClose()" blur="submit" onbeforesave="validate($data)">{{item.label.text}}</span>

Example Fiddle: http://jsfiddle.net/NfPcH/8269/

Upvotes: 2

Related Questions