View Full Version : Issue with escaping out of Ext.Editor

4 May 2009, 4:09 PM

I'm providing a WYSIWYG editor for my application using the Ext.Editor object.

I have an issue with validating the editor contents.

Please follow these steps to reproduce the issue.

Expand the attached zip file and open editor.html
Double click on the text and edit it to "Hello". Hit Enter.
You'll get an error saying that the length of the string should be greater than 10. Exit the dialog.

The editor is focused again. Hit Esc without changing the text.
Result : You'll get the error message again
Expected : The text should revert to the original text and the validation logic shouldnt be calledNote that this happens only if you first try to save an invalid entry by hitting Enter and then hit Esc.
If you just enter something invalid and hit Esc, it will revert to the original text.

I noticed that the "complete" listener is called even on escaping (I'd expect only the "canceledit" listener to be called)
Seems like an issue with Ext event handling. Would appreciate any inputs to fix this.


5 May 2009, 4:12 AM
I think you are looking for this bugfix (http://extjs.com/forum/showthread.php?t=48335).

(feel free to bump the bug thread; it's still not fixed in SVN)

5 May 2009, 12:47 PM
Ok thanks. That resolves the issue of events being fired incorrectly.

However i still have an issue.

When something invalid is entered in the field i want to show an error message and relaunch the editor without persisting any changes to the UI. The editor should have the entered invalid value but if I now hit Esc it should revert to the original valid value.

I tried calling a this.cancelEdit(true) inside the "complete" listener but that didnt do it.

Whats a good way to accomplish this?

Thanks again!

5 May 2009, 11:55 PM
I've updated my original patch (http://extjs.com/forum/showthread.php?t=48335) to also solve your problem (you'll need to set revertInvalid:false).

6 May 2009, 9:31 AM
Hi Condor,

That actually doesnt solve the problem, perhaps its because of the way Im handling my validation..

When i enter an invalid value - i save the value to the underlying field, close the editor and programatically open it again as if it were a fresh instance.

Because of this, if i enter an invalid value again and hit Esc, it doesnt revert to the original valid value.

Seems like I need some sort of handler in the "complete" event handler that will
- Save and exit on entering a valid value
- But on entering an invalid value, will not save and also keep the editor open with the invalid value, so if i hit Esc now, it reverts to the original valid value.

Like Id mentioned, a this.cancelEdit(true) inside the "complete" listener doesnt do anything..


6 May 2009, 10:05 PM
You don't need to close the editor. The only tricky part is to show an error dialog, e.g.

var ed = new Ext.Editor(new Ext.form.TextArea({
allowBlank: false,
enterIsSpecial: true,
isValid: function(preventMark){
var valid = this.constructor.prototype.isValid.call(this, preventMark);
if(!valid && (preventMark !== true)){
Ext.Msg.alert('Invalid entry', this.invalidMsg);
return valid;
listeners: {
invalid: function(fld, msg){
fld.invalidMsg = msg; // store message so we can use it later
completeOnEnter: true,
cancelOnEsc: true,
updateEl: true,
revertInvalid: false // required to keep editing when invalid
ed.startEdit('content'); // assuming you have a <div id="content">