Hi, I am on ASP.NET CORE MVC & JQuery v5.0.4, and i have added a Modal with a summernote editor: [http://keenthemes.com/metronic/preview/?page=components/forms/widgets/summernote&demo=default])
In the Metronics demo if you press enter the editor goes to next line, in my modal if you press enter the data is saved and modal closes. How to prevent enter key to do this.
Here is my _AddEmployeeNoteModal.js
(function () {
app.modals.AddEmployeeNoteModal = function () {
var _modalManager;
var _employeeService = abp.services.app.employee;
var _$form = null;
this.init = function(modalManager) {
$('#summernote').summernote({
height: 150,
dialogsInBody: true
});
_modalManager = modalManager;
_$form = _modalManager.getModal().find('form[name=EmployeeNoteForm]');
};
this.save = function () {
var employeeNote = _$form.serializeFormToObject();
var markupContent = $('#summernote').summernote('code');
employeeNote.content = markupContent;
_modalManager.setBusy(true);
_employeeService.addEmployeeNote(
employeeNote
).done(function () {
_modalManager.close();
abp.event.trigger('app.addEmployeeNoteModalSaved');
}).always(function () {
_modalManager.setBusy(false);
});
};
};
})(jQuery);
4 Answer(s)
-
2
Hi @rvanwoezik,
you can change modal behavior. There are lines in *.Web.Mvc\wwwroot\Common\Scripts\ModalManager.js
_$modal.find('.modal-body').keydown(function (e) { if (e.which === 13) { if (e.target.tagName.toLocaleLowerCase() === "textarea") { e.stopPropagation(); } else { e.preventDefault(); _saveModal(); } } });
you can add summernote editor element into this keydown event. For example, I mean something like this:
... if($(e.target).arrt('class')=='note-editor') ...
-
0
Thanx! it's working now!
_$modal.find('.modal-body').keydown(function (e) { if (e.which === 13) { if ((e.target.tagName.toLocaleLowerCase() === "textarea") || ($(e.target).arrt('class') === 'note-editable')) { e.stopPropagation(); } else { e.preventDefault(); _saveModal(); } } });
-
0
Glad it helped!
-
1
I know this is closed two years ago, but for those (like me) finding this solution from a search...
The solution above did not work for me, and I was also reluctant to edit the ModalManager.js in case a future upgrade of ASPNETZERO reverted my change.
So I did this in my CreateOrEditModal.js file, in the "this.init" function, right after invoking summernote():
$('.note-editing-area').keydown(function (e) { if (e.which === 13) { e.stopPropagation(); } });
Because SummerNote uses the note-editing-area class for its text input box.