GrapesJS Issues

3,464 parsed GitHub issues β€” 370 solved Β· 90 open. Search, filter and explore battle-tested answers.

877 issues found

πŸ” question
#3239Jan 18, 2021by harsh2014 answers
5 reactions

How to update attribute/properties dynamically from Component Script?

We have a use case where we want to insert charts dynamically using Highcharts Editor. I have created a component, which on drag and drop, opens a modal based and based on user's selection, returns a SVG image. I am wondering how can I add it to the model's body. Right now I am using innerHTML to insert but the getHTM...

artf

You don't need components with JS in this case (in your final code you don't execute any JS), is enough for you something like this:

harsh201

Sorry for spamming. I was not able to upload usecase video from my work laptop. https://user-images.githubusercontent.com/2502711/106098322-d39c7b80-615e-11eb-8569-cf76ffc7fcc7.mov

harsh201

@artf Any help here will be appreciated. I went through the docs again and nothing stands out, which I could be missing.

#3238Jan 18, 2021by sizhousama3 answers
1 reactions

How to load external javascript,i tried all methods,Useless

I write html strings as blocks, and need to introduce a lot of external scripts and styles, but I tried all the methods, when I drag the block to the canvas, the script does not take effect, but styles can be loaded,I hope to get help。Load by appendchildinit load by canvas:{scripts:[...]} who can help me?

harsh201

@sizhousama I am loading scripts/stylesheets via canvas while initializing grapesjs editor and it works for me. More details can be found here. Hope it helps!

sizhousama

The console shows loaded

GJSBlock

Thanks for reporting this, @sizhousama. Great question about [Question]: How to load external javascript,i tried all methods,Useless. The recommended approach with StyleManager is to use the event-driven API. Start here: Check the GrapesJS...

#3237Jan 15, 2021by Abhisheknanda13444634 answers
2 reactions

Add Trait For wrapper

Hi @artf I've added trait for wrapper this way. How can I perform the init function for the same Here is the code @artf Could you please help me? Thanks.

artf

You can use this option from components on init https://github.com/artf/grapesjs/blob/69e5ab2c1176e6fdeac1b058398cca55efe92df3/src/dom_components/config/config.js#L9 PS: stop annoying other people with your issues, please or I have to bloc...

Abhisheknanda1344463

Sorry @artf I'll keep this in mind. Thanks

Abhisheknanda1344463

@ryandeba Any suggestion?

#3235Jan 15, 2021by AnnaSu1 answer
0 reactions

"component:update" does not trigger when components are moved

Taken from https://github.com/artf/grapesjs/blob/dev/src/editor/index.js#L33 component:update - Triggered when a component is updated (moved, styled, etc.), the model is passed as an argument to the callback reproduce the buguse move API to move componenthttps://grapesjs.com/docs/api/component.html#moveclick arrow up/...

GJSBlock

Thanks for reporting this, @AnnaSu. The issue with "component:update" does not trigger when components are moved appears to be a race condition or state management timing problem. This typically happens when component lifecycle events and...

#3234Jan 15, 2021by tonypartridge1 answer
0 reactions

Absolute mode and dynamic tags not positioned correctly...

So I have this issue... I have a 'text' box which is set to be full width but centres a name shortcode. When then generate a PDF and HTML page of this and expect the name to be central too. But as the name sizes can vary I've just realised with absolute positioning it is still taking the container size of of the value...

GJSBlock

Thanks for reporting this, @tonypartridge. Great question about Absolute mode and dynamic tags not positioned correctly.... The recommended approach with GrapesJS is to use the event-driven API. Start here: Check the GrapesJS documentation...

#3233Jan 15, 2021by Abhisheknanda13444632 answers
0 reactions

Set Toolbar on every Component

Hi @artf Is there any standard way to add a new toolbar on every component I've tried this way When I run this code on the browser console it's working as expected but when I placed this code In the component file this is not working when we define a new trait for all the components it's working fine. For Toolbar it's...

artf

Follow the issue template (version, live demo, etc.)

GJSBlock

Thanks for reporting this, @Abhisheknanda1344463. Great question about Set Toolbar on every Component. The recommended approach with Components is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific...

#3232Jan 15, 2021by matiasmasciotta2 answers
0 reactions

DRAG AND DROP COMPONENTS:

Hi, I have the following issue: I need an event type editor.on ("sorter: drag: end") which is thrown in all these cases: (detect what element and where I'm dropping it) 1- let it hear when you drag and drop an element from the blockManager and drop it on the canvas. 2- let it hear when you drag an already componentize...

bgrand-ch

Hello, For future questions or technical issues, which aren't bugs, GitHub's Discussions tab is the place to be. Don't forget to close this issue if it is resolved or write a new detailed message in Discussions -> Q&A category (and close t...

GJSBlock

Thanks for reporting this, @matiasmasciotta. Great question about DRAG AND DROP COMPONENTS:. The recommended approach with ProseMirror is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific module Lo...

#3231Jan 13, 2021by vatte214 answers
2 reactions

How to change gjs-ckeditor-format component

hi guys, we all know that gjs-ckeditor-plugin working with [data-gjs-type]="text" components. I wanna know , could we change this option? I want to make my own custom component with for example [data-gjs-type]="anyDiv" and have the same functionality like in [data-gjs-type]="text". maybe someone knows how to change th...

Abhisheknanda1344463

@vatte21 To make your component editable.You've to extend the text type in your component like this way

vatte21

@Abhisheknanda1344463 Thank you! Ill try

abulka

@Abhisheknanda1344463 your code fragment gives me an error Uncaught ReferenceError: type is not defined on the line where is type defined?

#3228Jan 12, 2021by Abhisheknanda13444631 answer
0 reactions

Component Value is not changing

Hi @artf I've added a new component here is the code on selecting the h1 and h2 tag it's changing the value in the HTML section as you can see in the video but the content is not updating according to the tag. could you please help me with this? Thanks https://user-images.githubusercontent.com/20657737/104281764-03e3e...

GJSBlock

Thanks for reporting this, @Abhisheknanda1344463. Great question about Component Value is not changing. The recommended approach with ProseMirror is to use the event-driven API. Start here: Check the GrapesJS documentation for your specifi...

Browse all topics