anatolykopyl/file-directory
1
0
Fork 0
mirror of https://github.com/anatolykopyl/file-directory.git synced 2026-03-26 12:54:30 +00:00
Code Issues Projects Releases Wiki Activity

Styled progress bar

Browse Source
This commit is contained in:
Anatoly Kopyl
2022-01-04 12:39:27 +03:00
parent 632ba780af
commit 0064ca7b18
2 changed files with 3 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
index.php
View File

@@ -23,8 +23,8 @@
</div> </div>
</label> </label>
<input id="upload" type="file" class="d-none"> <input id="upload" type="file" class="d-none">
<div class="progress"> <div class="progress d-none mb-5" id="progress">
<div id="progress" class="progress-bar d-none" role="progressbar"></div> <div class="progress-bar" role="progressbar"></div>
</div> </div>

6
main.js
View File

@@ -22,10 +22,6 @@ fileInput.addEventListener('change', async function (event) {
const file = event.target.files[0]; const file = event.target.files[0];
let formData = new FormData(); let formData = new FormData();
formData.append("file", file); formData.append("file", file);
// const response = await fetch('upload.php', { method: "POST", body: formData });
// if (response.status === 200) {
// window.location.reload(false);
// }
axios.request({ axios.request({
method: "post", method: "post",
url: "upload.php", url: "upload.php",
@@ -33,7 +29,7 @@ fileInput.addEventListener('change', async function (event) {
headers: { "Content-Type": "multipart/form-data" }, headers: { "Content-Type": "multipart/form-data" },
onUploadProgress: (p) => { onUploadProgress: (p) => {
progressBar.style.display = 'block'; progressBar.style.display = 'block';
progressBar.style.width = `${p.loaded / p.total}%`; progressBar.children[0].style.width = `${p.loaded / p.total}%`;
} }
}).then (data => { }).then (data => {
window.location.reload(false); window.location.reload(false);