#2311October 6, 2019by gabrielbitencourt3 answers
Hello guys. I'm trying to modify the native link component, so far I have a modal that opens on the dblclick event and the user may choose between some pre defined links. The problem is, when I have the chosen link I'm not able to set it to the component. It works fine when I type the link in the Trait Manager. Here's...
artf
@gabrielbitencourt Link Component doesn't have the href property, so add it directly to attributes
gabrielbitencourt
thank you for the response @artf I tried that but it didn't work either, I could see (in the trait manager) that the href had been set using model.addAttributes({ href: link.url }) but it did not persist when I deselected and selected the...
artf
but it did not persist when I deselected and selected the component again maybe because you're still reading from this.model.get('href')... btw I can't help you more than this without a reproducible demo
#2310October 5, 2019by AbdallaMohammed3 answers
Hi iam doing a project with this library and i want to specify position for dragging components in it for example i have a div with id="drag-here" i want all components to be dragged in this div only i hope you can understand me , thank you all
pouyamiralayi
i don't have components iam using blocks according to this: i have a div with id="drag-here" i assume your block is something like this: the approach for your container block would be: and for target blocks: cheers!
pouyamiralayi
i have a div with id="drag-here" i want all components to be dragged in this div only if by this you mean you want all components to be draggable only in your target component, you can use `draggable` property. by specifying draggable on y...
AbdallaMohammed
by specifying draggable on your components like this: thank you for fast replay , but i don't have components iam using blocks
#2309October 5, 2019by shubhd471 answer
Hey, @artf thanks for creating this awesome library. its really helpful. I am using it in angular and I have used order list with numbers but it would be really helpful if there is a way to add an alphabetical ordered list or in roman numbers I was trying this but didn't work. please help
artf
Hi @shubh9415 the default RTE relies on execCommand API so the only available options are insertOrderedList and insertUnorderedList.
#2308October 5, 2019by rajasubburaj1 answer
artf
You're flattening the component by doing this selectedComponent.view.el['outerHTML'] and so you're removing all its properties. Read more about how Components work.
#2307October 4, 2019by Amitkumar855331 answer
Hi Everyone, I created a calendar plugin using @fullcalendar in GrapesJS Now I want to call a GraphQL API to fetch the events in the calendar. How to perform this in GrapesJS? Thanks in Advance !!!!!
pouyamiralayi
How to perform this in GrapesJS? you can make your api calls inside script. what ever js library you are using for making the calls it would be okay. cheers!
#2306October 4, 2019by dukie661 answer
I using grapejs demo websites script so that I can learn and build. is there any way I can remove all blocks and add my own blocks.
pouyamiralayi
Hi there! for removing blocks: for adding your own blocks see this. cheers!
#2305October 2, 2019by rajasubburaj1 answer
if(data.component.get('tagName') === 'img') { const selectedComponent = editor.getSelected(); const href = this.getHref(); const childHtml =<a href="${href}"></a> $(img#${selectedComponent.ccid}).wrap(childHtml); data.component.view.render(); editor.Modal.close(); }
#2303October 2, 2019by megarg3 answers
I would like to change how the toHTML output. I would like to modify the existing html output. I tried the "toHTML" property of componentit allows to return a new html elementbut it does not allow to get existing html and then update it and return it I tried calling toHTML inside toHTML to get access to original compo...
megarg
i solved this by doing below toHTML: function () { let el = <script> console.log("add script here") </script>; el = defaultType.model.prototype.toHTML.apply(this) + el; return el; }, Thanks a lot for your support
scott-coates
To get defaultType run this: var defaultType = editor.DomComponents.getType('default'); And this works too:
pouyamiralayi
Hi! did you try using `component.view.el inside your toHTML? it will give you access to the current DOM`. cheers!
#2302September 30, 2019by Amitkumar855333 answers
I have used an external plugin javascript version of @fullCalendar into the GrapesJS. I am able to render the calendar on the canvas but I am unable to use GrapesJS export feature to get JS, CSS and HTML of the following. I tried using 1) var html = editor.getHtml(); 2) var css = editor.getCss(); 3) var js = editor.ge...
pouyamiralayi
. But we are unable to show users the calendar on the canvas after drag and drop with render function in MODEL that is why we used OnRender in the VIEW. Did you try the component type definition i posted for you? it has been tested and it...
Amitkumar85533
Thanks a lot, @pouyamiralayi. The code you gave was working. Our code was not able to pick the dom element to render the calendar. Now it is working as expected. Thanks a lot for helping us out !!!! :-p
pouyamiralayi
Hi there! what you are looking for is using js inside components. just include the required js and css in the canvas scripts and styles section: after that build your own custom type component: then on code preview you will see the result...
#2300September 30, 2019by CatalinCernea3 answers
I saw the changes done by @JuanTincho of adding the "Order" attibute but I was able of adding it only on new categories created. I started from the "GrapesJs-Preset-Webpage". Is there a way of changing the Order after the initial render? This is how I add a new category by adding a new block. <pre>editor.BlockManager....
CatalinCernea
> but I was able of adding it only on new categories created.you can do this on all blocks by leveraging from getAll function. more on this here:for your case it might be something like this: cheers! Thank you! I'll try it ASAP. Have a goo...
pouyamiralayi
but I was able of adding it only on new categories created. you can do this on all blocks by leveraging from getAll function. more on this here: for your case it might be something like this: cheers!
DzevadS
Why am I getting an error "Uncaught TypeError: n is undefined" here? In the post #780 it should be possible to change the order of blocks in the following way const bm = editor.BlockManager; ["link", "map", "h-navbar", "countdown", "form",...