0

ユーザーがアップロードしたファイルを上書きするかどうかを確認するjqueryモバイルダイアログがあります。ユーザーが [はい] をクリックすると、アップロードするコールバック関数が呼び出され、[いいえ] をクリックすると、ダイアログが閉じて何も起こりません。

問題は、ユーザーが [いいえ] をクリックしてから、もう一度クリックしてアップロードし、上書きを受け入れると、コールバック関数が 2 回呼び出されることです。ダイアログ状態に入る回数に応じてコールバックを構築していますが、これを処理する方法がわかりません。

これは、ユーザーが「アップロード」をクリックするたびにエントリ ポイントになります。

CheckOverwriteUpload: function (boxFolderId, fileName) {
            var matchFound = false;
            $.each(BoxManager.Entries, function (index, value) {
                var entry = value;
                if (entry.name == fileName) {
                    matchFound = true;//Found the matching file
                }
            })


            if (matchFound) {
                //Pop the dialog to ask if they want to overwrite the file
                areYouSure("Overwrite File?", "The file " + fileName + " Already exists, would you like to overwrite it?", "Yes", function (result) {
                    if (result == true) {
                        //The client wants to overwrite the file, so we upload it
                        BoxManager.UploadFile(boxFolderId, fileName, true);

                    } else {
                        //The client does not want to overwrite. Close the dialog
                        $("#sure").dialog('close');
                    }
                    //Placed here to close the dialog after the possible upload
                    $("#sure").dialog('close');

                });
            } else {
                //No matches, go ahead and upload
                BoxManager.UploadFile(boxFolderId, fileName, matchFound);
            }

        },

ダイアログ機能はこちら

function areYouSure(text1, text2, button, callback) {

        $("#sure .sure-1").text(text1);
        $("#sure .sure-2").text(text2);
        $("#sure .sure-do").text(button).on("click", function () {
            callback(true);
        });
        $("#sure .close-do").text("No").on("click", function () {
            callback(false);
        });
        $.mobile.changePage("#sure", 'none', false, true);
    }

必要な場合に備えて、アップロード コードを次に示します。サーバー上のメソッドを呼び出すだけです

UploadFile: function (boxFolderId, fileName, overWrite) {
            $.mobile.showPageLoadingMsg();
            var etag = "";
            var id = "";
            $.each(BoxManager.Entries, function (index, value) {
                var entry = value;
                if (entry.name == fileName) {
                    etag = entry.etag;//hash of file used to overwrite files on box.com
                    id = entry.id;//unique box id for file. needed to overwrite file
                }
            });
            DocumentVaultService.UploadFileToBox(
                                        "<%=RootFolderGuid %>",
                                        "<%=FolderGuid %>",
                                        "<%=FileGuid %>",
                                        boxFolderId,
                                        fileName,
                                        "<%=IsClientFolder%>",
                                        "<%=AuthToken %>",
                                        overWrite,
                                        etag,
                                        id,
                                        function (result) {
                                            //Success on the upload, refresh the document list and close loading symbol
                                            BoxManager.GetBoxFolderContent(boxFolderId, BoxManager.BreadCrumbList[length - 1].folderName);
                                            $.mobile.hidePageLoadingMsg();
                                        },
                                        function (result) {

                                            $.mobile.hidePageLoadingMsg();
                                            alert("File failed to upload");
                                        });


        }

CheckOverwriteUpload と UploadFile は両方とも Boxmanager に含まれています。

var BoxManager = {
    CheckOverwriteUpload:function(){},
    UploadFile:function(){}
}

これが複数回呼び出されないようにするにはどうすればよいですか? ダイアログを呼び出す前に JavaScript キャッシュをクリアする方法はありますか? コールバックに表示されていないより良い構造はありますか?

4

2 に答える 2

0

同じイベントを同じボタンに複数回バインドし続けないようにしてください。

また、イベントをバインドするときに名前空間を追加して、誤って他のクリック イベントもバインド解除しないようにします。

$('button').off('click.box-manager').on('click.box-manager', function(e){
   ...do something
});

これは、誰もボタンにイベントを割り当てないことが確実にわかっている場合を除きます。

于 2012-10-12T21:43:22.453 に答える
0

呼び出すたびareYouSure()に、コールバックが再度バインドされます。これを回避する 1 つの方法は、バインドを解除してからバインドすることです。

$("#sure .close-do").text("No").unbind("click").on("click", function () {
    callback(false);
});

に注意してunbind("click")ください。これにより、以前のバインディングが削除されるため、スタックしません。
これを回避する別の方法は、Yes/No ボタンのバインドを、1 回だけ呼び出される別の場所 ( などpageinit) に配置することです。

于 2012-10-12T21:36:06.720 に答える