Как сделать progress bar, yii2 + ajax?

Question

[Caspergreen]

Есть ajax запрос

$.ajax({
                url: "converter/progress",
                dataType: "JSON",
                data: {file:file},
        
                success: function(data){
                    //console.log(data);
                }
        
            });

converter/progress - возвращает данные 1,2,3 и т.д. как вывести прогресс бар с обновлением?

Answer 1

[Boris Köln]

getbootstrap.ru/docs/3.3.7/components/#progress

Comments

[Caspergreen]

к яваскрипту как прикрутить?)

[Boris Köln]

яваскриптом поменять style.width

[Caspergreen]

Boris Korobkov,

$.ajax({
                url: "http://185.8.213.9/converter/progress",
                dataType: "JSON",
                data: {file:file},
        
                success: function(data){
                    document.getElementById('progress').style.width = data; 

                }
        
            });

<div class="progress">
  <div class="progress-bar" id="progress" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100">
    60%
  </div>
</div>

Не отрабатывает)

[Максим Тимофеев]

Caspergreen, консоль откройте, не отрабатывает - это ни о чем. Плюс :
.style.width = data;
Наверное в % указать надо, у Вас же там или число или строка или объект.

[Caspergreen]

Максим Тимофеев, возрвщает строку с процентом

Answer 2

[Евгений]

Или тут написано как сделать прогресс бар
https://www.w3schools.com/howto/howto_js_progressb...