Skip to content

Commit

Permalink
fix: 修復在 Summernote 外層套用 form 點擊部分按鈕會提交
Browse files Browse the repository at this point in the history 
dialog 預設 options.dialogsInBody 為 true 插入 body，為 false 插入 editor
toc, imagemap 按鈕加上屬性 type="button" 避免 form submit

Signed-off-by: wyttime04 <vanessa80332@gmail.com>
  • Loading branch information
@wyttime04
wyttime04 committed Jan 24, 2024
1 parent ce5b57e commit 3a6bf5f
Show file tree
Hide file tree
Showing 7 changed files with 29 additions and 18 deletions.
3 changes: 2 additions & 1 deletion src/plugin/custom/summernote-comment-popover.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -109,6 +109,7 @@
let titleMaxAttr = !!titleMaxLength? `maxlength="${titleMaxLength}"`: ""
let contentMaxAttr = !!contentMaxLength? `maxlength="${contentMaxLength}"`: ""
let body = ''
var $container = options.dialogsInBody ? $(document.body) : $editor
if (!disabledImage) {
body += [
'<div class="form-group summernote-comment-popover-form-group">',
Expand Down Expand Up @@ -142,7 +143,7 @@
fade: options.dialogsFade,
body: body,
footer: `<button href="#" class="btn btn-primary summernote-comment-popover-btn">${lang.commentPopover.ok}</button>`,
}).render().appendTo(options.container);
}).render().appendTo($container);
this.$dialog.find('.modal-body').addClass("summernote-comment-popover-form-container")
}
this.destroy = function () {
Expand Down
4 changes: 2 additions & 2 deletions src/plugin/custom/summernote-custom-specialchars.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -79,6 +79,7 @@
this.makeSpecialCharSetTable()[0].outerHTML +
'</div>';

var $container = options.dialogsInBody ? $(document.body) : $editor
this.$dialog = ui.dialog({
className: 'note-specialchar-dialog',
// Set the title for the Dialog. Note: We don't need to build the markup for the Modal
Expand All @@ -89,7 +90,7 @@
body: body,

// This adds the Modal to the DOM.
}).render().appendTo($editor);
}).render().appendTo($container);
}
this.destroy = function () {
this.$dialog.remove()
Expand Down Expand Up @@ -166,7 +167,6 @@
$specialCharDialog.one('shown.bs.modal', function () {
$specialCharNode.on('click', function (event) {
event.preventDefault();
console.log(event.currentTarget)
deferred.resolve(decodeURIComponent(event.currentTarget.title));
$specialCharDialog.modal('hide');
});
Expand Down
3 changes: 2 additions & 1 deletion src/plugin/custom/summernote-custom-style.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -175,6 +175,7 @@
this.css.attr('id', 'summernote-customStyle')
$(document.head).append(this.css)
}
var $container = options.dialogsInBody ? $(document.body) : $editor
this.$dialog = ui.dialog({
title: `${lang.customStyle.editStyleList}`,
className: 'summernote-customStyle-dialog',
Expand Down Expand Up @@ -221,7 +222,7 @@
`<p class="font-italic text-muted m-auto">${lang.customStyle.noStyleSelected}</p>`,
'</div>',
]).join(''),
}).render().appendTo(options.container);
}).render().appendTo($container);
this.$dialog.find('.modal-dialog').addClass('modal-xl')

this.loadingDropdownList()
Expand Down
6 changes: 4 additions & 2 deletions src/plugin/custom/summernote-imagemap.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -131,7 +131,7 @@
this.css.attr('id', 'summernote-imagemap')
$(document.head).append(this.css)
}

var $container = options.dialogsInBody ? $(document.body) : $editor
this.$dialog = ui.dialog({
title: `${lang.imageMap.editImageMap}`,
className: 'summernote-imagemap-dialog',
Expand All @@ -142,7 +142,7 @@
'<div class="summernote-imagemap-editor">',
'</div>',
].join(''),
}).render().appendTo(options.container);
}).render().appendTo($container);
this.$dialog.find('.modal-dialog').addClass('modal-xl')
}
this.destroy = function () {
Expand Down Expand Up @@ -453,6 +453,7 @@
this.$cancelBtn = $('<button>')
.text(lang.imageMap.cancel)
.addClass(['btn', 'btn-sm', 'btn-outline-primary'])
.attr({'type': 'button'})
.appendTo($modifyBtnGroup)
this.$cancelBtn.on('click', (event) => {
let $target = this.$activeElement
Expand All @@ -463,6 +464,7 @@
this.$saveBtn = $('<button>')
.text(lang.imageMap.save)
.addClass(['btn', 'btn-sm', 'btn-primary'])
.attr({'type': 'button'})
.appendTo($modifyBtnGroup)
this.$saveBtn.on('click', (event) => {
let $target = this.$activeElement
Expand Down
3 changes: 2 additions & 1 deletion src/plugin/custom/summernote-pastehtml.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,7 @@
lang = options.langInfo;

this.initialize = function () {
var $container = options.dialogsInBody ? $(document.body) : $editor
this.$dialog = ui.dialog({
title: `${lang.pasteHTML.htmlEditor}`,
className: 'summernote-pastehtml-dialog',
Expand All @@ -46,7 +47,7 @@
'</div>',
].join(''),
footer: `<button href="#" class="btn btn-primary summernote-pastehtml-btn">${lang.pasteHTML.ok}</button>`,
}).render().appendTo(options.container);
}).render().appendTo($container);
this.$dialog.find('.modal-body').addClass("summernote-pastehtml-form-container")
}

Expand Down
13 changes: 7 additions & 6 deletions src/plugin/custom/summernote-toc.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -80,6 +80,7 @@
$toolbar.append(this.$toc);
}

var $container = options.dialogsInBody ? $(document.body) : $editor
this.$dialog = ui.dialog({
title: `${lang.toc.editAnchortext}`,
fade: options.dialogsFade,
Expand All @@ -88,7 +89,7 @@
<b>${lang.toc.message}</b>
</div>`,
footer: `<button href="#" class="btn btn-primary ${prefix}-toc-btn">${lang.toc.addtoc}</button>`,
}).render().appendTo(options.container);
}).render().appendTo($container);
this.$dialog.find('.modal-body').addClass(`${prefix}-toc-form-container`)

$editingArea.css('display', 'flex').css('flex-direction', 'row')
Expand Down Expand Up @@ -198,11 +199,11 @@
text = $(d).attr('data-anchortext')

var $anchor = $('<a>').text(text).attr('href', '#' + id).css('flex', '2').css('align-self', 'center').css('overflow', 'hidden').css('text-overflow', 'ellipsis').css('white-space', 'nowrap')
var $input = $('<input>').attr('value', text).addClass(`${prefix}-toc-data-text`)
var $edit = $('<button>').text('編輯').addClass(['btn', 'btn-primary'])
var $del = $('<button>').text('移除').addClass(['btn', 'btn-primary'])
var $check = $('<button>').text('確認').addClass(['btn', 'btn-primary'])
var $cancel = $('<button>').text('取消').addClass(['btn', 'btn-primary'])
var $input = $('<input>').attr({'value': text, 'name': `${prefix}-toc-data-text`}).addClass(`${prefix}-toc-data-text`)
var $edit = $('<button>').text('編輯').addClass(['btn', 'btn-primary']).attr({'type': 'button'})
var $del = $('<button>').text('移除').addClass(['btn', 'btn-primary']).attr({'type': 'button'})
var $check = $('<button>').text('確認').addClass(['btn', 'btn-primary']).attr({'type': 'button'})
var $cancel = $('<button>').text('取消').addClass(['btn', 'btn-primary']).attr({'type': 'button'})
var $btncontainer = $('<div>').append([$edit, $check, $cancel, $del])
.css('flex', '2').css('display', 'flex').css('justify-content', 'space-evenly')
var $div = $('<li>').addClass(['form-group', `${prefix}-toc-form-group`]).append([$anchor, $input, $btncontainer])
Expand Down
15 changes: 10 additions & 5 deletions src/plugin/misc/summernote-ext-table.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@
modules = context.modules,
style = modules.editor.style,
options = context.options,
$editor = context.layoutInfo.editor,
$editable = context.layoutInfo.editable,
$toolbar = context.layoutInfo.toolbar,
lang = options.langInfo,
Expand Down Expand Up @@ -745,8 +746,7 @@
'</div>',
].join(''),
footer: '<input type="button" href="#" class="btn btn-primary note-btn note-btn-primary jtable-insert-table-btn" value="' + lang.jTable.apply + '" >'

}).render().appendTo(options.container);
}).render();
this.$insertTableDialog.find('.modal-dialog').addClass('modal-sm')

this.showInsertTableDialog = function () {
Expand Down Expand Up @@ -1280,7 +1280,7 @@
fade : options.dialogsFade,
body : mergeBody,
footer: mergeFooter,
}).render().appendTo(options.container);
}).render();
$mergeDialog.find('.note-modal-content').width(340);
$mergeDialog.find('.note-modal-body').css('padding', '20px 20px 10px 20px');

Expand Down Expand Up @@ -1718,7 +1718,7 @@
fade : options.dialogsFade,
body : tableInfoBody,
footer: tableInfoFooter,
}).render().appendTo(options.container);
}).render();
// $tableInfoDialog.find('.note-modal-content').width(340);
$tableInfoDialog.find('.note-modal-body').css('padding', '20px 20px 10px 20px');

Expand Down Expand Up @@ -2183,7 +2183,7 @@
'</div>',
].join(''),
footer: `<button href="#" class="btn btn-primary note-btn note-btn-primary jtable-apply-btn">${lang.jTable.apply}</button>`,
}).render().appendTo(options.container);
}).render();

var styleCellIcon = `<svg width="20" height="20" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg">
<path stroke="#000" d="m311.18514,530.07222l692.70151,-0.49145l-2.60466,356.17646l-691.05339,-0.37879l0.95653,-355.30622zm655.16326,34.88934l-615.24031,0.00936l0.53173,284.73966l614.62469,-0.52735l0.08389,-284.22167z" stroke-width="20" fill="#000000"></path>
Expand Down Expand Up @@ -3069,6 +3069,11 @@
$(document.head).append(this.$css)
}
context.invoke('jTable.updateCurrentStyle')
var $container = options.dialogsInBody ? $(document.body) : $editor
this.$insertTableDialog.appendTo($container);
$mergeDialog.appendTo($container);
$tableInfoDialog.appendTo($container);
$styleCellDialog.appendTo($container);
};

self.destroy = function () {
Expand Down

0 comments on commit 3a6bf5f

Please sign in to comment.