2

SOには、プログレスバーに関連する質問がすでにたくさんあることに気づきました。私はそれらの多くを閲覧しましたが、物事を機能させることができませんでした。

簡単に言えば、私はJSPでページを開発しており、ブートストラップ内のアニメーション化されたプログレスバーを使用して、データの呼び出しが行われている間に表示したいと考えています。

HTML：

<div class="row-fluid">
   <div class="span12 progress progress-striped active">
      <div id="searchAnimation" class="bar" hidden="true"></div>
   </div>
</div>

サーブレット（この部分が関連しているかどうかはわかりませんが、申し訳ありませんが安全です）：

@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response)
    throws ServletException, IOException
{
    //String that gets returned as HTML
    StringBuilder returnAsHTML = new StringBuilder();

    //See if the class is closed, has a lab, or is just a regular class
    for(ClassInfo classes : springClassListings)
    {
        //Class is full, style accordingly
        if(classes.getSectionMeetingInfo().contentEquals("LEC") && classes.getSectionEnrolled().contentEquals("0"))
        {
            returnAsHTML.append(closedClass(classes));
        }
        else if(classes.getSectionMeetingInfo().contentEquals("LAB")) //These are labs, style accordingly
        {
            returnAsHTML.append(labClass(classes));
        }
        else //These are normal classes without lab components
        {
            returnAsHTML.append(openClass(classes));
        }

    }

    response.setContentType("text/html");
    response.setCharacterEncoding("UTF-8");
    response.getWriter().write(returnAsHTML.toString());
}

そして私のスクリプト：

//Serves up the data
$('#btnData').click(function() {

    //THIS IS THE PROGRESS BAR
    $("#searchAnimation").show();

    $.get('daoServlet', function(responseText) {
        $('#dataDisp').html(responseText);
    });

});

データを取得するという観点から、$。get呼び出しがどこにあるかによってプログレスバーの幅が％になるという考えがわかります。どうすればいいのかわからない。

PS-doGetのfor/ifが厄介なアンチパターンであることはわかっていますが、それを回避する方法をまだ理解していません。

4

1 に答える 1

1

ajaxStartにはイベントにパーセンテージ情報が含まれていると思いました。ただし、アニメーション化されたプログレスバーを100％で表示/非表示にして、何かが読み込まれていることを示すことができない場合でも。

ajaxStartドキュメント http://api.jquery.com/ajaxStart/

進捗ドキュメント http://twitter.github.com/bootstrap/components.html#progress

ajaxを使用していないものをロードする場合は、ajaxStartイベントをスローして、コンポーネントを非表示および表示するようにトリガーすることもできます。

于 2013-01-17T19:49:33.617 に答える