How to call a function which is outside the component in script function of component.
Question
Please help in solving the below issue.
How to call a function which is outside the component in script function of component.
ex:
demo.myFunction function should be called in component script, but script is not able to recognize demo variable. Where as demo.myFunction can be called in init function.
grapesjs.plugins.add('my-plugin', function(editor, options) {
var demo = {
this.myFunction(id){
alert(this.id);
}
}
var domComponents = editor.BlockManager;
domComponents.add('my-block', {
id: 'myComp',
label: 'Custom',
category: 'plugin',
attributes: {
class: 'fa fa-square-o'
},
style: {
padding: '100px'
},
content: {
type: 'myComp'
}
});
var comps = editor.DomComponents;
var defaultType = comps.getType('default');
var defaultModel = defaultType.model;
var defaultView = defaultType.view;
comps.addType('myComp', {
model: defaultModel.extend({
init(){
// working fine
demo.myFunction(this.id);
},
defaults: Object.assign({}, defaultModel.prototype.defaults, {
removable: true,
draggable: true,
style: {
// 'background-color':'yellow',
},
editable: true,
copyable: true,
badgable: true,
highlightable: true,
resizable: true,
droppable: true,
content: `<svg style="width:90%;">
</svg>`,
script: function() {
console.log(this);
//not working
demo.myFunction(this.id);
},
})
},
// Define the View
view: defaultType.view.extend({
render: function() {
defaultType.view.prototype.render.apply(this, arguments);
return this;
},
}),
});
})
Thank you.Answers (2)
You'll find the answer here #358
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 #445
calling a function which is outside the component same as explained in issue #395
I am calling a function which is outside the component same as explained in issue #395 but it is returning a string instead of a function I...
Issue #358
Calling updateScript from the script section of a pluging
Hi guys, I've been stuck for a few hours trying to figure out how to call updateScript from the script section of a custom plugin. So far I...
Issue #1691
How to use variable/function outside of the script
Hello @artf , How can i access the variable as well functions which is outside of the script. My code is like, I am using angular.js(Angula...
Issue #2061
[QUESTION] How to place a component at the end of the canvas.
How can I put my footer at the end of the canvas? I want the editor to not allow placing a block/widget below the footer. example
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.