Enable confirmation box when remove block
Question
Is there any option to activate a confirmation box before delete any block?
Answers (3)
Nope, but you can extend the default tlb-delete command
editor.Commands.add('tlb-delete', ed => {
if (confirm('Sure?')) {
const selected = ed.getSelected();
selected && selected.destroy();
}
});
@artf this works only for toolbar button, but when I hit "delete" on my keyboard it doesn't. How can I override this event?
Hi @Iceweex, unfortunately, at the moment, you can't. For the next release, I'll centralize those commands and will update also its event lifecycle, so in that case, you'll able to achieve the task in this way
const commandName = 'core:component-delete';
editor.on(`run:${commandName}:before`, (options) => {
console.log(`BEFORE ${commandName}`);
if (!confirm('Are you sure')) {
options.abort = 1;
}
});
editor.on(`run:${commandName}`, (deleted, options) => {
console.log(`AFTER ${commandName}`, deleted);
});
editor.on(`abort:${commandName}`, (options) => {
console.log(`ABORT ${commandName}`);
});
Related Questions and Answers
Continue research with similar issue discussions.
Issue #5046
is there any way to remove cross svg on selected default value of Float, Position and text-align
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Version 111.0.5563.147 (Official Build) (6...
Issue #3313
There are lots of click required to make text editable, can we make text field editable on a single Click.
WARNING READ and FOLLOW next 3 steps, then REMOVE them before posting the issueFollow CONTRIBUTING Guidelines https://github.com/artf/grape...
Issue #3405
FEAT: An event to hook into before a block in dropped into the canvas
WARNING READ and FOLLOW next 3 steps, then REMOVE them before posting the issueFollow CONTRIBUTING Guidelines https://github.com/artf/grape...
Issue #2561
How to add extra options to the block element next to delete option ?
WARNING READ and FOLLOW next 5 steps, then REMOVE them before posting the issueFollow CONTRIBUTING Guidelines https://github.com/artf/grape...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.
Browse free plugins →Premium plugins ship with support, regular updates, and production-ready features — save days of integration work.
Browse premium plugins →Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.