upload progress bar script

1 
2postFile('thumbnail' , 'progress-bar-thumbnail');
3
4
5//  "InputFile" & "ProgressBar" are ID of elements 
6function postFile(InputFile , ProgressBar) {
7            var formdata = new FormData();
8
9            formdata.append(InputFile, $('#'+InputFile)[0].files[0]);
10
11            let request = new XMLHttpRequest();
12
13            request.upload.addEventListener('progress', function (e) {
14                let file1Size = $('#'+InputFile)[0].files[0].size;
15
16                if (e.loaded <= file1Size) {
17                    let percent = Math.round(e.loaded / file1Size * 100);
18                    $('#'+ProgressBar).width(percent + '%').html(percent + '%');
19                }
20
21                if(e.loaded == e.total){
22                    $('#'+ProgressBar).width(100 + '%').html(100 + '%');
23                }
24            });
25
26  			// instead of '/admin/blog', write your form action
27            request.open('post', '/admin/blog');
28            request.timeout = 45000;
29            request.send(formdata);
30        }

1<center><form id="upload_container" action="upload.php" method="post"><div><label>Upload Image File:</label><input name="userImage" id="userImage" type="file" class="demoInputBox" /></div><br /><div><input type="submit" id="btnSubmit" value="Submit" class="btnSubmit" /></div><div id="progress-div"><div id="progress-bar"></div></div><div id="targetLayer"></div></form><div id="loader-icon" style="display:none;"><img src="loading.gif" /></div></center>