How to refresh drag & drop file uploader, after dynamically


Topic: How to refresh drag & drop file uploader, after dynamically setting data-default-file attribute by jQuery.

dgvai asked 5 years ago

It shows default image by setting static in html, but doesn't show after setting dynamically. here is the code i set to set dynamically:

$('#e-input-file').attr('data-default-file','http://localhost/path/to/img');


Aliaksandr Andrasiuk staff answered 5 years ago

Hi,

You can try to change directly the image src attribute. F.e. I added a button below the File Upload :

<button id="fileinputBtn">Change image</button>

And added an onClick listener:

const fileupload = $('#input-file-now-custom-1');
const btn = $('#fileinputBtn');
const fileuploadImg = $('.file-upload-preview-img')[0];

btn.on('click', () => {
     fileuploadImg.setAttribute('src', "../img/sample.jpg");
});

Hope it will help you.

Best regards.


cowfactory answered 4 years ago

I have the same problem, In my edit record form, I want to assign an image to the input file_upload dynamically. And there is no way to refresh the field. Is there a method that does a refresh of the field?. I try to call the method $('#file_upload).file_upload() again and it doesn't work either.

I assign dynamically the attribute $('#file_upload').attr("data-default-file", file_url)


Krzysztof Wilk staff commented 4 years ago

Hi!

The example above is great. I think you have to use another event. When exactly you want to change a file?

Best regards


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.8.5
  • Device: Windows PC
  • Browser: Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: Yes