upload file progress bar

Bonjour, je voudrais faire un truc, quand on sur le 'upload file', je voudrais que le progress bar s'affiche avec le taux de telechargement, j'essaie de mettre ça en mettre en place, le progress bar s'affiche mais le taux de telechargment s'avance pas. quelqu'un pourrait jeter un coup d'oeil à mon code me mettre sur la bonne voie, merci

mon formulaire:

<div class="row">
<div class="col-md-12">

<?php echo $this->Form->Create('Event', array(
'type'=>'file','label' => false,'class'=>'col-md-12 go-right','action'=>'index'));?>
<div style="display:none;" id="welcomeDiv">
<div id="progress-bar"></div>
</div>

<p>  <?php echo $this->Form->input('titre', array('placeholder'=>__('TITLE OF YOUR PUBLICATION'),'label' => false,'type'=>'text','class'=>'form-control'));?></p>
<p><?php echo $this->Form->input('content', array('placeholder'=>__('CONTENU PUBLISHING'),'label' => false,'type'=>'textarea','class'=>'form-control'));?></p>

<p class="input-file-container"> 
<?php echo $this->Form->input('filename',array('name'=>"data[Event][filename]",'class'=>'input-file','id'=>'my-file','label'=>false,'type'=>'file','onclick'=>"showDiv()"))?>
<label for="my-file" class="input-file-trigger" tabindex="0"><?php echo __('click here to select picture or video') ;?> &nbsp;<i class="fa fa-video-camera"></i> &nbsp;&nbsp;&nbsp;<i class="fa fa-picture-o"></i>&nbsp;&nbsp;&nbsp;<b class="file-return"></b> &nbsp;&nbsp;&nbsp;size max 120Mo</label>                    
</p>
<p align=""><?php echo $this->Form->button(__('CREATE PUBLICATION'),array('class'=>'btn btn-outlined btn-white btn-sm','data-wow-delay'=>'0.7s'));$this->Form->End();?>
</p>
</div>
</div>

mon code javascript

<script type="text/javascript">

$(document).ready(function() { 
    $('#my-file').click(function() {    
    var file = $('#my-file').val();
      if(file !='') {
      e.preventDefault();
      $('#welcomeDiv').css("display","block");    
      uploadProgress: function (event, position, total, percentComplete){   
                    $("#progress-bar").width(percentComplete + '%');
                    $("#progress-bar").html('<div id="progress-status">' + percentComplete +' %</div>')
                }   

        }
    });
});

</script>

Merci