Download Sails.js file using Semantic-UI progress bar not working

Question

I am creating a module for downloading files using the Sails.js framework.

Now I want to use the progress bar from the Semantic-UI, but the code I tried below only works after the download process is complete.

How can I make the progress bar the actual download progress?

<form action="/fileUpload" enctype="multipart/form-data" class="ui form" method="post">

    <div class="field">
        <input type="file" name="uploadFile" />
    </div>

    <div class="field">
        <input type="submit" value="Upload" class="ui blue submit button" />
    </div>

</form>

<div class="ui indicating progress" data-percent="0" id="uploadProgress">
    <div class="bar" style="transition-duration: 300ms; width: 100%;"></div>
    <div class="label"></div>
</div>

<script>
    $('#uploadProgress').progress('increment');
</script>