'Show progress on html file input?
I want to show a progress bar or spinner when I choose a file for upload, I'm not talking about server upload success, I already got that covered, I want to show a spinner when image is loading right after I click the "Choose file" button from the input file, is that possible?
I'm using Vue.
<label class="modal_input_image fs_normal c_dark" :for="field.id" :style="'background-image:url('+backgroundImage+');'"></label>
<input :id="field.id" type="file">
Solution 1:[1]
Check out the input and change events on file inputs - after the value of the file input changes, it should fire those events - try both, see which one suits your needs.
Show the 'loading' indicator when the event first fires, hide the indicator on server upload success!
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | matt lohkamp |