Codeigniter + ProgressBar

Hello. I'm trying to develop a file upload system which at the post it generates and loads a progressbar according to the course of my file unpacking, reading and storage script in the database. This is the first time I'm messing with progressbar and ajax . I am using the framework codeigniter . Below is my controller function code and .js.

 public function index() {
    if ($this->input->post()) {
        $cpt = count($_FILES['file']['name']);
        $files = $_FILES;
        for ($i = 0; $i < $cpt; $i++) {
            $_FILES['file']['name'] = $files['file']['name'][$i];
            $_FILES['file']['type'] = $files['file']['type'][$i];
            $_FILES['file']['tmp_name'] = $files['file']['tmp_name'][$i];
            $_FILES['file']['error'] = $files['file']['error'][$i];
            $_FILES['file']['size'] = $files['file']['size'][$i];
            $targetPath = getcwd() . '/uploads/';
            $targetFile = $targetPath . $_FILES['file']['name'];
            move_uploaded_file($_FILES['file']['tmp_name'], $targetFile);
            $FileXML = $this->extrair($targetFile);
            //$this->readXml($FileXML);
        }
    }

My view:

<form id="uploadform" action="Curriculo" method="POST" enctype="multipart/form-data">
<div class="progress progress-striped active">
    <div class="progress-bar progress-bar-info" id="progressbar" style="width:0%">
    </div>                                        
</div>
<div class="form-group">
    <input type="file" multiple="multiple" id="file" name="file[]" multiple data-preview-file-type="any" data-upload-url="#">
</div> 
<div class="panel-footer">
    <button type="submit" class="btn btn-success " id="submit" name="submit">CADASTRAR</button> 
</div>

My script.js

$(function () {
var inputFile = $('input:file');
var uploadURI = $('#uploadform').attr('action');
var progressBar = $('#progressbar');
var data = new formData();

$('#submit').on('click', function (event) {
    var FilesToUpload = inputFile[0].files;
    if (FilesToUpload.length > 0) {
        for (var i = 0; i < FilesToUpload.length; i++) {
            console.log('oi');
            var file = FilesToUpload[i];
            data.append("file[]", file, file.name);
        }

        $.ajax({
            url: uploadURI,
            type: 'post',
            data: data,
            processData: false,
            contentType: false,
            success: function () {
            },
            xhr: function () {
                var xhr = new XMLHttpRequest();
                xhr.upload.addEventListener(".progress-bar", function (event) {
                    if (event.lengthComputable) {
                        var percentComplete = Math.round((event.loaded / event.total) * 100);
                        console.log(percentComplete);

                        $('.progress-bar').show();
                        progressBar.css({width: percentComplete + "%"});
                    }
                    ;
                }, false);

                return xhr;
            }
        });
    }
});

});

The error stated is that formData of script.js has not been defined. However, I have tried to pass the form and field as parameters, leave null and also put append and continue with the error.