0

コード ビハインド ( upload.aspx) には、ストリーミングされているバイト数を返すイベントがあります。デバッグすると、正常に動作します。イベントハンドラーから返された数値をプログレスバーに反映したかったのですが、ここで迷子になりました。jQueryの .ajax() 関数を使ってみました。これが私がそれを実装した方法です:

コード ビハインドの EventHandler に、次のコードを追加して .ajax() 関数を呼び出しました。

Page.ClientScript.RegisterStartupScript(this.GetType(), "UpdateProgress", "<script type='text/javascript'>updateProgress();</script>");

私の計画は、eventHandler 関数がストリーミングされるバイトの値を変更するたびに、javascript 関数「updateProgress()」を呼び出すことです。

.ajax() 関数「UpdateProgress()」は次のとおりです。

function updateProgress() {

        $.ajax({
            type: "POST",
            url: "upload.aspx/GetData",
            data: "{}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            async: true,
            success: function (msg) {

                $("#progressbar").progressbar("option", "value", msg.d);

            }
        });
    }

関数 GetData() が [System.Web.Services.WebMethod] であり、静的であることも確認しました。私が実装しようとしているワークフローは次のとおりです。 - [アップロード] ボタンをクリックします - 背後のコードが実行を開始し、EventHandler がトリガーされます - EventHandler が .ajax() 関数を呼び出します - .ajax() 関数は、ストリーミングされているバイトを取得して更新しますプログレスバー。

コードを実行したとき。.ajax() がアップロードの完了時にのみ実行されることを除いて、すべて正常に実行されます (また、進行状況バーもアップロードの完了時にのみ更新されます)。上記のように、 eventHandler 関数で毎回 .ajax() 関数を呼び出しても...

私は何を間違っていますか?私はこれを正しく考えていますか?おそらくupdatePanelか何かを追加する必要があるものは他にありますか?

4

1 に答える 1

1

これを一度試してください:

$("#progressbar").progressbar({
    value: 0
});

$("#btnUpload").click(function() {
    var intervalID = setInterval(updateProgress, 250);
    $.ajax({
        type: "POST",
        url: "upload.aspx/GetData",
        data: "{}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        async: true,
        success: function(msg) {
            $("#progressbar").progressbar("value", 100);
            clearInterval(intervalID);
        }
    });
    return false;
});

function updateProgress() {
    var value = $("#progressbar").progressbar("option", "value");
    if (value < 100) {
        $("#progressbar").progressbar("value", value + 1);
    }
}​
于 2012-12-09T18:28:17.283 に答える