3

DirtyFormsを使用していますが、プラグインの基本機能は動作しています。ユーザーがページから移動しようとすると、ブラウザーは確認ダイアログをスローします。

モーダル確認には jQuery UI のダイアログを使用しています。これを DirtyForms で動作させようとしています。これには、jQuery UI ダイアログを直接参照する例があります。ページから直接例を使用してカスタム ダイアログを設定していますが、jQuery ダイアログを使用しておらず、ブラウザのネイティブ ダイアログを引き続き使用しています。

$.DirtyForms.dialog = {
    selector: '#unsavedChanges',
    fire: function(message, dlgTitle) {
        $('#unsavedChanges').dialog({title: dlgTitle, width: 350, modal: true});
        $('#unsavedChanges').html(message);
    },
    bind: function() {
        $('#unsavedChanges').dialog('option', 'buttons',
            [
                {
                    text: "Stay Here",
                    click: function(e) {
                        $.DirtyForms.choiceContinue = false;
                        $(this).dialog('close');
                    }
                },
                {
                    text: "Leave This Page",
                    click: function(e) {
                        $.DirtyForms.choiceContinue = true;
                        $(this).dialog('close');
                    }
                }
            ] 
        ).bind('dialogclose', function(e) {
            // Execute the choice after the modal dialog closes
            $.DirtyForms.choiceCommit(e);
        });
    },
    refire: function(content) {
        return false;
    },
    stash: function() {
        return false;
    }
}

プラグインのデバッグをオンにすると、エラー (またはその他の JS エラー) は表示されませんが、モーダル ダイアログは起動せず、ブラウザーのネイティブ ダイアログのみが起動します。同じページに実装された他の jQuery UI ダイアログが機能します。ここで何が欠けているのかわかりません。どんな助けや洞察も大歓迎です。

4

1 に答える 1