determine the percentage of the file uploaded to the server using php

1$.ajax({
2  xhr: function() {
3    var xhr = new window.XMLHttpRequest();
4
5    xhr.upload.addEventListener("progress", function(evt) {
6      if (evt.lengthComputable) {
7        var percentComplete = evt.loaded / evt.total;
8        percentComplete = parseInt(percentComplete * 100);
9        console.log(percentComplete);
10
11        if (percentComplete === 100) {
12
13        }
14
15      }
16    }, false);
17
18    return xhr;
19  },
20  url: posturlfile,
21  type: "POST",
22  data: JSON.stringify(fileuploaddata),
23  contentType: "application/json",
24  dataType: "json",
25  success: function(result) {
26    console.log(result);
27  }
28});
29

1$(function() {
2
3    var bar = $('.bar');
4    var percent = $('.percent');
5    var status = $('#status');
6
7    $('form').ajaxForm({
8        beforeSend: function() {
9            status.empty();
10            var percentVal = '0%';
11            bar.width(percentVal);
12            percent.html(percentVal);
13        },
14        uploadProgress: function(event, position, total, percentComplete) {
15            var percentVal = percentComplete + '%';
16            bar.width(percentVal);
17            percent.html(percentVal);
18        },
19        complete: function(xhr) {
20            status.html(xhr.responseText);
21        }
22    });
23}); 
24
25
26
27
28
29<form action="file-echo2.php" method="post" enctype="multipart/form-data">
30    <input type="file" name="myfile"><br>
31    <input type="submit" value="Upload File to Server">
32</form>
33
34<div class="progress">
35    <div class="bar"></div >
36    <div class="percent">0%</div >
37</div>
38
39<div id="status"></div>
40