Skip to content

Commit c9868bb

Browse files
js based file upload
1 parent 36ba50f commit c9868bb

File tree

2 files changed

+24
-0
lines changed

2 files changed

+24
-0
lines changed

public/index.html

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,31 @@ <h1> Image Upload</h1>
1414
<input type="file" name="avatar" id="image">
1515
<input type="submit" value="Upload Image">
1616
</form>
17+
18+
<h1> Image Upload By JavaScript</h1>
19+
20+
<input type="text" name="fullname" id="fullName">
21+
<input type="file" name="avatar" id="avatar">
1722

1823

1924
</body>
25+
<script>
26+
document.getElementById('avatar').onchange = function(e){
27+
fileUpload(e);
28+
}
29+
function fileUpload(e){
30+
// this method you can use with any JS frontend library
31+
let formData = new FormData();
32+
formData.append('avatar',e.target.files[0]);
33+
// this first arg is == 'name' attribute
34+
formData.append('fullname',document.getElementById('fullName').value);
35+
fetch('/image',{
36+
method:'POST',
37+
body: formData
38+
}).then(response=>{
39+
console.log(response)
40+
})
41+
}
42+
43+
</script>
2044
</html>

uploads/html

2.52 KB
Binary file not shown.

0 commit comments

Comments
 (0)