2017-10-23 4 views
0

サーブレットへのajax APIコールを呼び出すときに、ブートストラップの進行状況バーを表示したいとします。サーブレットへのapi呼び出し中にブートストラップ進行コンポーネントを追加する方法

私のapi呼び出しのための以下のコードを見つけてください。

open(id) { 
ajax({ 
url: 'api/get_order', 
method: 'GET', 
data: { 
id: id 
} 
}, (data) => { 
if (data.error == null) { 
} else { 
alert(data.error); 
} 
}); 
} 

上記のajax apiコール中に、私はブートストラップのプログレスバーを表示したいと思います。以下のコードを見つけてください。

あなたが/ progress_statusの値を計算するために

//on progress 
$('.progress-bar').attr('style', 'width: ' + progress_status + '%;'); 

バー - 進捗状況のCSSを変更することにより、進捗状況を増減することができます

<div class="progress"> 
<div class="progress-bar" role="progressbar" style="width: 25%;" aria- 
valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div> 
</div> 

答えて

0

:あなたは、実際のプログレスバーをしたい場合

  1. をあなたがサーバーからのサポートを必要とするサーバー上の状態を示し、サーバーからの応答に基づいて値を計算します。
  2. '静的な'進捗バーが必要な場合は、ループ/タイムアウトを実装して、ロジックに基づいてprogress_statusを増やすことができます。 2秒で10%増加します。
関連する問題