0

アプリケーションでいくつかの jquery ui ダイアログを使用して、ユーザーからの入力を収集し、CRUD 操作を行います。ページでダイアログが必要な場合、次の手順を実行します。

最初に、このようにダイアログを初期化するために必要な最小限のマークアップとコードを定義します

<div id="dialogPanel" style="display:none" title=""></div>

そして、DOM の準備ができたら、

$("#dialogPanel").dialog({
    autoOpen: false, hide: 'slide', show: 'bounce', resizable: false, 
    position: 'center', stack: true, height: 'auto', width: 'auto', 
    modal: true, overlay: { opacity: 0.5, background: "white" }
});

次に、必要に応じて ajax 呼び出しを使用してダイアログにコンテンツを読み込みます。

<button id="addCustomer">Add Customer</button>

この

$("#addCustomer").button().click(function(event) {
    event.preventDefault();
    loadDialog("/Customer/Create", "", "Add New Customer");
});

function loadDialog(action, id, title) {
    $("#dialogPanel").dialog("option", "title", title);
    if (id != "") 
        action = action + "/" + id;
    $.ajax({
        type: "get",
        dataType: "html",
        url: action,
        data: {},
        success: function(response) {
            $("#dialogPanel").html('').html(response).dialog('open');
        }
    });
}

ajax 呼び出しは、ダイアログ内に表示され、動的にサイズ変更される強力な型指定されたビューを返します。厳密に型指定されたビューには、他の ajax 呼び出しを実行するボタンがいくつかあります (たとえば、データベースで検証して永続化するコントローラー アクションに対して)。これらの呼び出しは通常、ダイアログ DIV に追加される HTML コードを返します。

私の質問は次のとおりです。ダイアログを閉じるにはどうすればよいですか? ダイアログの右上隅にある「X」ボタンをクリックするか、ESCキーを押すことで実行できますが、強い型付きビュー内にあるボタンをクリックした結果として実行したいと思います。

ただし、この種のコードは使用したくありません

$("#dialogPanel").dialog('close');

#dialogPanel DIV 自体を定義しない、厳密に型指定されたビュー内。

良い解決策は何ですか？

4

1 に答える 1

2

メインフォームでcloseDialog関数を作成し、ダイアログ内からその関数を呼び出します。次に、ダイアログをホストする他のページも「closeDialog」関数を定義する必要があります。

また、closeDialog関数を指すデリゲートを渡して、物事をさらに分離することもできます。

于 2010-10-01T19:21:36.643 に答える