File tree 2 files changed +24
-0
lines changed
2 files changed +24
-0
lines changed Original file line number Diff line number Diff line change @@ -14,7 +14,31 @@ <h1> Image Upload</h1>
14
14
< input type ="file " name ="avatar " id ="image ">
15
15
< input type ="submit " value ="Upload Image ">
16
16
</ 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 ">
17
22
18
23
19
24
</ 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 >
20
44
</ html >
You can’t perform that action at this time.
0 commit comments