Показывать индикатор выполнения при загрузке видео с помощью плагина jquery ⇐ Jquery

[Anonymous]

I am uploading a video in laravel. Video is being uploaded perfectly and for the validation, I am using jQuery Validate plugin.

I want to show progress bar, while uploading video. I have added a progress bar. But it does not work.

form is: Below is the form to select a video and show the progress bar.

Select Video* Select a file to upload (Max file size must be less than 100MB)
OR
Drag a file into this box

Add a video ajax is: Below is the submitHandler. Because I am using jquery validation.
submitHandler: function(form) { var formData = new FormData(form); $.ajaxSetup({ headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') } }); $('#videoSubmit').html('Please Wait...Do not reload page or click on any button.'); $("#videoSubmit").attr("disabled", true); $.ajax({ url: '{{ route('video.store') }}', type: "POST", data: formData, processData: false, contentType: false, beforeSend: function () { var percentage = '0'; }, uploadProgress: function (event, position, total, percentComplete) { // $('.videoProgressBar').show(); var percentage = percentComplete; $('.progress .progress-bar').css("width", percentage+'%', function() { return $(this).attr("aria-valuenow", percentage) + "%"; }) }, success: function(response) { //$('#videoSubmit').html('Submit Your Video'); //$("#videoSubmit"). attr("disabled", false); if (response.success == 'error') { $('#videoSubmit').html('Submit Your Video'); $("#videoSubmit").attr("disabled", false); $('.errorDisplayDiv').html(response.message); $('html, body').animate({ scrollTop: 0 }, 0); $('.successDiv').slideDown('slow', function() { /*setTimeout(function() { $('.successDiv').slideUp('slow'); }, 5000);*/ }); } else { window.location.href = response.redirect; } }, error: function(xhr, status, error) { var errors = JSON.parse(xhr.responseText).errors; $.each(errors, function(key, value) { $("#" + key + "_videos-error").html(value[0]); }); reloadCaptcha_video(); $('#videoSubmit').html('Submit Your Video'); $("#videoSubmit").attr("disabled", false); } }); }

Источник: https://stackoverflow.com/questions/781 ... ery-plugin