GrapesJS Issues

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

1,399 issues found

πŸ” outdated
#996Apr 3, 2018by HarshOB3 answers
1 reactions

Change attribute value that is generated through trait

Now, let's consider that I wrote new into the trait value but in attribute :items, I want to append prefix like item.text. to that value So, my final attribute :items become item.text.new. Is that possible?

artf

I'd say it's enough just this

artf

You should be able to achieve it via a custom trait, eg. by overriding getValueForTarget method

HarshOB

I tried creating custom trait and override a method but didn't see any attribute generated. can you please look at this code and correct me if there's any error. When I write data in traits it should generate attribute as ':text=item.text....

#995Apr 3, 2018by sublimekaushik2 answers
0 reactions

How to add fields on trait dynamically

I am building the trait when the application starts. so getting the below fields at side bar as settings Now I want more field to be loaded (in the below picture 'product' and 'Product Image' ) along with previously loaded field ('Logo Url', 'Redirect Url'). And these two fields('product' and 'Product Image' ) will be...

artf

In your case, you have to update all those models model.get('traits').add([{name: 'product'}, {...}])

lock[bot]

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.

#994Apr 3, 2018by crazyxhz3 answers
3 reactions

How to make sure block is dropped only at the top level

For example I have two blocks A and B that I want to drop to the editor canvas. But sometimes the block that dropped later become the child of existing block. That is A>B layout. But I want to force the blocks can only be the sibling level.eg. A+B How can I do that? Maybe component:add event?

crazyxhz

@anand-gopinath cool~ work like a charm. Now I found many data attributes usage.... It is a very good framework but the doc is lag behind...

anand-gopinath

@crazyxhz : You can do it by adding data attributes to the content "data-gjs-droppable='.className'", For ex https://jsfiddle.net/wswvuvab/2/

lock[bot]

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.

#993Apr 3, 2018by duccanh00223 answers
0 reactions

Didn't display data with remote storageManager

Hi, I have a problem: When I copy and paste email template (http://www.charlesmudy.com/respmail/ - I used gjs-open-import-webpage plugin). Save to db ...seen everything OK. Editor: <img width="1277" alt="screen shot 2018-04-03 at 11 16 19" src="https://user-images.githubusercontent.com/4942484/38228973-7cf40f60-3730-1...

artf

So when you refresh the page the load request is sent, right? Try to see what you get from these listeners

duccanh0022

Hi, thanks for reply. Finally, I have found my bug. Component field in mysql database is TEXT type not enough space. I changed to LONGTEXT. Everything seem OK. Thanks again!

lock[bot]

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.

#992Apr 2, 2018by vladbpython2 answers
0 reactions

Editor trigger click fancybox

Good day, May I show all hidden (display:none) divs in template in editor? for example fancybox, help with logic please.

artf

eg. editor.DomComponents.getWrapper().find('.some-query').forEach(model => model.setStyle({display: ...}))

lock[bot]

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.

#990Apr 1, 2018by anand-gopinath2 answers
0 reactions

How to listen an event for custom component's style update?

@artf @arthuralmeidap @nojacko I have a custom component like, this and i the code looks like https://jsfiddle.net/nganand/n97g7g43/ . How to listen to an event when custom component's property changed (Ex, when styling padding/margin)? like init() { this.listenTo(this.model, "component:styleUpdate:text-align", this.h...

artf

For component's properties use this.listenTo(this.model, "change:prop-name" ...By doing ...attributes.align = "left" Component doesn't see your changes, use instead this.model.components().at(0).addAttributes({ align: 'left' }), you don't...

lock[bot]

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.

#989Mar 29, 2018by tommedema3 answers
1 reactions

Consecutive spans render whitespace differently in grapes' editor than in ordinary window

I've spent the greater part of an afternoon trying to debug this. While I have reduced this to a small and easy to reproduce test case, I didn't find the root cause of this issue yet. Hopefully someone can help. Note the following HTML template: If you render this in a browser, it renders as: <img width="133" alt="scr...

artf

Yeah Tom thanks, I think a configurable option (eg. keepWhitespace?!?) might be a good solution

artf

This is due to the node cleaning while traversing https://github.com/artf/grapesjs/blob/dev/src/parser/model/ParserHtml.js#L155-L158

tommedema

Thanks @artf, I see. I would suggest removing this or at least making this configurable (defaulting to true then to prevent breaking changes). Would you accept a PR for this?

#987Mar 29, 2018by baxxos3 answers
0 reactions

Dropdown indicator not displayed for a custom trait

Hello, the dropdown (select) element arrow indicator icon is not rendered when adding a custom trait to a component: I'm using following code to add the custom trait to the link component: Is there anything I'm missing? An extra attribute perhaps? Everything else works fine, except for this detail (which is apparently...

nojacko

I think you have to override the CSS.

baxxos

Successfully resolved via a "dirty hack" (overloading the initialize method) referenced here: #972

lock[bot]

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.

#986Mar 29, 2018by nojacko2 answers
2 reactions

Exported CSS cannot override body's background-color

When a body background style is defined in the style option of the init function it's not possible to override. Given the style: After changing the background-color in Grapes, the CSS output is: Due to the ordering, the original colour will take precedence when used. While not necessarily an issue, the repetition of b...

artf

Thanks James, we already aware of it #552 but unfortunately not yet provided any fix :/ The main problem is that GrapesJS doesn't handle well body/wrapper styling and so, as a result, we have the body coming from 3 different spots:from pro...

lock[bot]

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.

#985Mar 29, 2018by tomichal3 answers
1 reactions

Can GrapesJS allow uploading arbitrary file through the built in asset manager?

I looked at the asset manager code as well as the wiki and it seems like despite the docs claiming that the asset manager can handle uploading arbitrary files (i.e. by adding an arbitrary asset type), the actual asset manager code hardcodes file type image/* on the file input field of the file upload form https://gith...

artf

Good question, I think the issue is the OpenAssets command itself that should be renamed in OpenImageAssets (indeed it renders only images types). So, what you can try to do is to create another command (eg. a more generic one or just for...

tomichal

@artf I created the referenced pull request. I admit my motivation was my specific use case, but hopefully it was coded generically enough to be acceptable in the core editor codebase.

tomichal

... oh and just to clarify - another chunk of code written alongside this pull request resides in a custom plugin of my project. It's a plugin that essentially does the following:Customises the Link DOM component such that upon creating a...

Browse all topics