MVC Classic ウィジェット > Wijprogressbar |
wijprogressbar ウィジェットを使用して、エンドユーザーが操作の進捗状況を認識できるようにします。アニメーション、スタイル、ラベルなどを使用して、インジケータの外観を簡単にカスタマイズできます。
プログレスバーを表示するビューの .cshtml ファイルを開きます。次のマークアップのように、DOM 要素を追加します。
ソースビュー |
コードのコピー
|
---|---|
<div id="progressbar" style="width:50px;height:300px"></div> |
ここで、ウィジェットを初期化する必要があります。これを行うには、次のスクリプトを .cshtml ファイルに追加できます。
ソースビュー |
コードのコピー
|
---|---|
<script id="scriptInit" type="text/javascript"> $(document).ready(function () { $("#progressbar").wijprogressbar({ value: 75, fillDirection: "north" }); }); </script> |
値と fillDirection オプションが設定されることに注意してください。プロジェクトを起動すると、north に 設定された fillDirection オプションによりプログレスバーは垂直になり、値プロパティにより値は 75% に設定されます。
wijprogressbar の詳細については、Wijmo 製品マニュアルをご覧ください。