Issue #1816Opened February 20, 2019by Shah-ali0 reactions

Not allowing to upload same image on same the position after delete that image

Question

Ajax call which is uploading image file in assests folder

module.exports =  {
  // Default assets
  assets: [],

  // Style prefix
  stylePrefix: 'am-',

  // Url where uploads will be send, set false to disable upload
  upload: 'http://localhost/grapeJs/src/file_uploader/fileUpload.php',

  // Text on upload input
  uploadText: 'Drop files here or click to upload',

  // Label for the add button
  addBtnText: 'Add image',

  // Custom uploadFile function
 // @example
  uploadFile: function(e) {
    var files = e.dataTransfer ? e.dataTransfer.files : e.target.files;
    // ...send somewhere
      console.log(files);

      var formData = new FormData();

      for(var i in files){
          formData.append('file-'+i, files[i])
      }

      $.ajax({url: 'http://localhost/grapeJs/src/file_uploader/fileUpload.php',
          type: 'POST',
          data: formData,
          contentType:false,
          crossDomain: true,
          mimeType: "multipart/form-data",
          processData:false,
          success: function(result){
            var images = result.data; // <- should be an array of uploaded images
            editor. AssetManager.add(images);
          }
});

  }

 //  uploadFile: '',
};

It's working fine to add an image from the local.

But in another scenario, It's not working. Please have a look Drag image block Select an image Delete that image Add the same image again on same the place, "uploadFile" function is not calling It's not allowing me to upload same image on same position after delete that image

Answers (3)

artfFebruary 22, 20190 reactions

We have to clear the file input once the image is selected

Shah-aliFebruary 23, 20190 reactions

Any hint please. how to clear file input?

Shah-aliFebruary 25, 20190 reactions

I think, I have fixed it. In OpenAssets.js

if (accept) {
      const uploadEl = amContainer.querySelector(
        `input#${config.stylePrefix}uploadFile`
      );
      uploadEl && uploadEl.setAttribute('accept', accept);
      uploadEl.value = "";
    }

Related Questions and Answers

Continue research with similar issue discussions.

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.