Uploaded image error
Question
We have gotten GrapesJs integrated into our Angular application. We have the asset manager showing a list of images that have been uploaded. Initially, there are no images and upon dragging an image and then handling the upload the asset manager shows the correct image.
Upon uploading an image we are returning an object with one image in the data property, so the 1 image is appended to the existing. On initialisation, we are returning an object will the existing images.
The problem exists in the uploaded image, it's shown in the editor with the "missing picture" image and does not show the uploaded image. The only way I can get the uploaded image to appear is to double click on
the image and select it via the asset manager.
I have attached a video showing the current issue and how it works.
The created img tag in the editor does not have a src attribute e.g. <img data-gjs-type="image" alt="name-of-image-here.png" class="gjs-plh-image gjs-comp-selected" onmousedown="return false">
Answers (3)
You should output this for your upload endpoint: https://grapesjs.com/docs/modules/Assets.html#response
eg.
{
data: [{src: '.../image.png'}]
}
Hi That worked, in the documentation, you might want to update the documentation to remove the first line in the array and only use the object version for the return data.
{ data: [ 'https://.../image.png', // ... { src: 'https://.../image2.png', type: 'image', height: 100, width: 200, }, // ... ] }
@aerionTech right, but I think I'll update the upload function to make it understand also string items
Related Questions and Answers
Continue research with similar issue discussions.
Issue #646
Images dropped onto image picker get uploaded twice
Set the asset manager with the dropzone option set to true (which is true by default), something like that: then drop an image onto the dro...
Issue #372
Asset Manager not automatically add images to assets after uploading
The JSON response of an upload is like this {"data":["http://url.com/flower.jpg"]} The response event is working.In the response event resp...
Issue #401
Cannot upload images
Hi, while uploading an image through asset manager, I get the following error: Assetmanager configuration at editor init looks like Folder...
Issue #1335
[Question] Image not rendering when upload the different image with the exact same name available in asset manager list
Scenario: I have image "image1.jpg" in asset manager list. Now I am renaming different image to "image1.jpg" and uploading to Asset Manager...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.