Stop window from closing in tinyMCE in onSubmit function - tinymce

Question

I am trying to add some validation logic to the code plugin for tinyMCE.
It seems, however, that when a window's onSubmit function is called, the window closes by default.
The onSubmit function currently looks like this:
onSubmit: function (e) {
// We get a lovely "Wrong document" error in IE 11 if we
// don't move the focus to the editor before creating an undo
editor.focus();
editor.undoManager.transact(function () {
editor.setContent(e.data.code);
});
editor.selection.setCursorLocation();
editor.nodeChanged();
}
What I would like to do is add some validation logic to the plugin to prevent tinyMCE from reformatting invalid html and, rather, display a message that the html is invalid. Essentially, something like this:
onSubmit: function (e) {
// We get a lovely "Wrong document" error in IE 11 if we
// don't move the focus to the editor before creating an undo
var isCodeValid = true;
//check if code valid
isCodeValid = ValidateCode(e.data.code);
if (isCodeValid) {
//if code valid, send to tinyMCE to let it do it's thing
editor.focus();
editor.undoManager.transact(function () {
editor.setContent(e.data.code);
});
editor.selection.setCursorLocation();
editor.nodeChanged();
}
else {
//if code invalid, display error message and keep text editor window open
tinyMCE.activeEditor.windowManager.alert("Your HTML is invalid. Please check your code and try submitting again.");
return;
}
}
However, it seems that the onSubmit function closes the text editor window regardless. I was wondering if there is a way to stop it from doing this. I have scoured the documentation which leaves much to be explained and have looked at other plugins as examples. The closest I can find is the searchandreplce plugin. The 'Find' button calls the onSubmit function, but it seems to stay open if the 'find' text field is blank. However, the logic behind it seems very different from what I can use in the Code plugin as it is.
Can anyone who is familiar with the tinyMCE API give me any ideas on how to prevent the window from closing when onSubmit is called? Or do I have to go another route?

Answer 1

As per this question the way to cancel an event is to return false;. This will keep the popup open. Your code would then become:
onSubmit: function (e) {
// We get a lovely "Wrong document" error in IE 11 if we
// don't move the focus to the editor before creating an undo
var isCodeValid = true;
//check if code valid
isCodeValid = ValidateCode(e.data.code);
if (isCodeValid) {
//if code valid, send to tinyMCE to let it do it's thing
editor.focus();
editor.undoManager.transact(function () {
editor.setContent(e.data.code);
});
editor.selection.setCursorLocation();
editor.nodeChanged();
}
else {
//if code invalid, display error message and keep text editor window open
tinyMCE.activeEditor.windowManager.alert("Your HTML is invalid. Please check your code and try submitting again.");
return false;
}
}

Answer 2

I figured it out finally. All you need to do is add e.preventDefault(); at the start of the onSubmit function and the window will not close. The documentation was no help, but looking at the searchandreplace plugin as an example lead me to the answer. What I have now is like this:
onSubmit: function (e) {
e.preventDefault();
// We get a lovely "Wrong document" error in IE 11 if we
// don't move the focus to the editor before creating an undo
var isCodeValid = true;
//check if code valid
isCodeValid = ValidateCode(e.data.code);
if (isCodeValid) {
//if code valid, send to tinyMCE to let it do it's thing
editor.focus();
editor.undoManager.transact(function () {
editor.setContent(e.data.code);
});
editor.selection.setCursorLocation();
editor.nodeChanged();
}
else {
//if code invalid, display error message and keep text editor window open
tinyMCE.activeEditor.windowManager.alert("Your HTML is invalid. Please check your code and try submitting again.");
return;
}
}
e.PreventDefault() seems to stop the default behavior of the onSubmit function.