0

I've a problem with ajaxUpload. I want to call ajax request during file upload.

here is my code to generate a bootstrap-FileInput:

$("#form_csvFile").fileinput({
   maxFileSize: 10000,
   maxFileCount: 1,
   language: 'fr',
   dropZoneEnabled: false,
   showUploadedThumbs: true,
   showUpload: true,
   showUploadedThumbs: false,
   showPreview: false,
   browseClass: "btn btn-primary",
   removeClass: "btn btn-danger",
   uploadUrl: "{{ path('notation_import') }}",
   layoutTemplates: {
        progress: ""
   },
   ajaxSettings: {
       async: true
   }
}).on('filebatchuploaderror', function(event, data, previewId, index) {
   $("#progressValue").html("100%");
   $("#finalProgress .progress-bar").css('width', "100%");
   $("#finalProgress .progress-bar").prop('aria-valuenow', 100);
   $("#finalProgress .progress-bar").addClass("progress-bar-danger");
   clearInterval(myInterval);
}).on('filebatchuploadsuccess', function(event, data, previewId, index) {
   $("#progressValue").html("100%");
   $("#finalProgress").css('width', "100%");
   $("#finalProgress").prop('aria-valuenow', 100);
   $("#finalProgress").addClass("progress-bar-success");
   clearInterval(myInterval);
}).on('filepreajax', function(event, previewId, index){
   $("#finalProgress").show();
   myInterval = setInterval(function(){
       $.ajax({
           url: '{{ path('notation_ajax') }}',
           async: true,
           success: function (data) {
               if (data.percent == 100) clearInterval(myInterval);
               $("#progressValue").html(data.percent + "%");
               $("#finalProgress .progress-bar").css('width',data.percent + "%");
               $("#finalProgress .progress-bar").prop('aria-valuenow', data.percent);
            }
        });
    }, 1500);
});

During document upload I have implement a Javascript "setInterval()" method to get percentage of completion (with ajax call witch return percentage only in Json).

Problem : First request send by bootstrap FileInput to upload my file blocks others... Ajax request

I tried to set async = true in ajax setting and getPercentage request, but nothing change. Anyone has a solution for me ?

Thanks

Rob
  • 14,746
  • 28
  • 47
  • 65
RudySkate
  • 51
  • 1
  • 1
  • 10
  • It should already be async by default as synchronous ajax is deprecated: https://xhr.spec.whatwg.org/ and http://stackoverflow.com/questions/11448011/jquery-ajax-methods-async-option-deprecated-what-now – Universal Electricity May 24 '16 at 13:03
  • **Exactly** but this option don't stop the script so it's not a solution for my problem... The first query send by InputFile plugin prevent others queries to check progression percent. – RudySkate May 25 '16 at 08:08

0 Answers0