# File upload progress

**URL:** <https://forum.elixirforum.com/t/file-upload-progress/1234>\
**Category:** Questions\
**Tags:** phoenix\
**Created:** [July 29, 2016, 5:32pm UTC](https://forum.elixirforum.com/t/file-upload-progress/1234 "2016-07-29T17:32:34Z")\
**Posts on this page:** 1\
**Showing post:** 2

<div class="post-metadata">

**Author:** ![sysashi](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/sysashi/32/11669_2.png) [@sysashi](https://forum.elixirforum.com/u/sysashi)\
**Post date:** [July 30, 2016, 12:08am UTC](https://forum.elixirforum.com/t/file-upload-progress/1234/2 "2016-07-30T00:08:30Z")

</div>

if you are asking about client side (js), then this would work fine, assuming you have an Upload controller that accepts post request on “/upload”

```elixir
...
function sendFIle(file) {
  var uri = "/upload";
  var xhr = new XMLHttpRequest();
  var fd = new FormData();
  xhr.open("POST", uri, true);

  xhr.upload.addEventListener("progress", function(e) {
    if (e.lengthComputable) {
      var percentage = Math.round((e.loaded * 100) / e.total);
    }
  }, false);

  fd.append('myFile', file);
  xhr.send(fd);
}
...

```

copied from MDN 🙂

---

_[View the full topic](https://forum.elixirforum.com/t/file-upload-progress/1234)._
