GrapesJS / grapesjs

Free and Open source Web Builder Framework. Next generation tool for building templates without coding
https://grapesjs.com
BSD 3-Clause "New" or "Revised" License
22.38k stars 4.06k forks source link

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

Closed Shah-ali closed 5 years ago

Shah-ali commented 5 years ago

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

artf commented 5 years ago

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

Shah-ali commented 5 years ago

Any hint please. how to clear file input?

Shah-ali commented 5 years ago

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 = "";
    }
Shah-ali commented 5 years ago

@artf : I really want to thank you for your help.

lock[bot] commented 4 years ago

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.