Any approach to use class to control the data-gjs-{property} ?
Question
Hi @artf, any approach to use class to control the data-gjs-property? Such as i added a class "non-copyable" to element, then the component will auto change the copyable property to false, let the user cannot copy the element in the editor.
Answers (2)
You can make use of Events
editor.on('component:add', model => {
const cls = model.getAttributes()['class'];
cls == 'non-copyable' && model.set('copyable', 0);
})
This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #1101
apply css property for mobile/tablet view
Hello @artf , https://jsfiddle.net/66cnd2t4/3/ This is the fiddle for the map issue when you drag a map and add it then in dimensions you w...
Issue #1374
Default Component Properties
Is there any way I can change the default properties of components? I want almost everything to be copyable: false, resizable: false, dragg...
Issue #1951
[QUESTIONS] change or add event on add component from block
is it possible ?, change the drag and drop event to on click when adding a new component, I want to add components by clicking the block th...
Issue #1762
image not change while we fetch html using editor.getHtml()
Hello @artf I am using grapes.js for my website-builder tool into my website. While i double click on any image the asset-manager will open...
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 →Related tutorials
In-depth guides on the same topic.
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.