5

データ項目のいくつかの行を含むテーブルがあります。行ごとに、いくつかのメソッド（データ項目の削除、ステータスデータ項目の変更など）を呼び出すアクションリンクがいくつかあります。

各ユーザーがボタンをクリックする前に、jqueryダイアログを表示して、ユーザーに情報を含むダイアログ、[OK]および[キャンセル]ボタンを表示します。

ChangeStatusメソッドを呼び出すajax.actionlinkのサンプルコード：

<%= Ajax.ActionLink(item.Status, "ChangeStatus", new { id = item.Id }, new AjaxOptions { UpdateTargetId = "ListReturns-Div", OnBegin = "StartChangeStatus", OnSuccess = "EndChangeStatus", OnFailure = "FailureChangeStatus" }, new { @class = "StatusBtn" })%>

これは、呼び出されるjquery関数です。

 function StartChangeStatus(e) {
            $('#dialog-confirm').dialog({
                resizable: false,
                height: 200,
                modal: true,
                buttons: {
                    'Continue': function () {
                        $(this).dialog('close');
                        $('#Loading-Div').show('slow');
                    },
                    Cancel: function () {
                        $(this).dialog('close');
                        e.preventDefault();
                    }
                }
            });
        }

actionlink関数とjquery関数が機能します。しかし、問題は、アクションリンクがクリックされたときに現在のアクションを一時停止/停止できないことです。ボタンをクリックすると、穴あけプロセスが実行され、ダイアログ確認ボタンは無視されます。だから私の質問は、先に進む前に、ダイアログの確認で必要に応じて動作するようにactionlinkまたはjquery関数を変更する方法ですか？

4

2 に答える 2

4

私もあなたのコードを試してみましたが、同じ動作が得られました。確認ボックスを表示するようにコードを修正しました。

<%= Ajax.ActionLink("Link", 
                    "ChangeStatus", 
                    new { id = 3 }, 
                    new AjaxOptions { UpdateTargetId = "ListReturns-Div", 
                                      HttpMethod = "Post", 
                                      Confirm = "confirmClick" }, 
                                      new { @class = "StatusBtn" }
                   )
%>

そしてそれはjavascriptの確認を表示しています。うまくいかない原因を探る必要があります。

于 2010-06-03T11:04:26.803 に答える
2

私のウェブサイトから：

さて、Ajax.ActionLink は非常に便利で、Confirm AjaxOption はさらに便利です...それでも、最近はくだらない Javascript アラートを必要とする人がいるでしょうか? Ms MVC 2 を使用してアプリケーションを開発しており、素晴らしい JQueryUI ライブラリを使用して、すべての要素のビジュアルをカスタマイズしています。JQueryUI の最も優れた機能の 1 つは、ダイアログ ウィンドウです...「このファイルを削除してもよろしいですか? はい/いいえ」のようなものです...そして、Ajax.ActionLink でそれらを使用したいです!

ネットで答えが見つからなかったので、簡単な方法を探しました...そして今ここに投稿します。

最初に: Ricardo Covo によって書かれた素敵なチュートリアルを読んでページに実装します: "Ajax & jQuery UI ダイアログによる ASP MVC 削除の確認" (ググってみてください)

hide('fast') の代わりに remove() を使用し、クラス「item」を tr に適用して削除するだけで、彼の Javascript コードに簡単な変更を加えました。

deleteLinkObj.closest("tr").hide('fast')

になる

deleteLinkObj.closest("tr.item").remove();

これで、前のチュートリアルに従った後、代替する準備が整いました

<%: Html.ActionLink([LinkName],[ActionName], new { id = item.Id }, new { @class = "delete-link" })%>

と列をなす

<%:Ajax.ActionLink([LinkName],[ActionName],[ControllerName],new { id = item.Id },new AjaxOptions{HttpMethod = "Delete" /*You can use Post though*/,OnBegin = "JsonDeleteFile_OnBegin" /*This is the main point!*/}, new { @class = "delete-link" } ) %>

必要に応じて Post メソッドを使用できます。ここで重要なのは、JQueryUI ダイアログ確認の前にサーバー アクションが呼び出されるのを防ぐ JavaScript を呼び出す OnBegin オプションです。

<script language="javascript">function JsonDeleteFile_OnBegin(context) {return false;/*Prevent the Ajax.Action to fire before needed*/}</script>

ページに JavaScript を配置します。

さて、何が起こるか: [削除] ボタンをクリックすると、OnBegin 関数を呼び出しながら JQueryUI が開きます (通常のポスト アクションをキャンセルします)。「確認」の場合、Ricardo Covo のコードはサーバー側のアクションを起動し、Ricardo Covo の確認の JavaScript コードでは、成功の場合にすべてのアクションを実行できます (行の削除を非表示にするなど)。

注意: このメソッドでは、Ricardo Covo の JavaScript コードで関数の成功/失敗を管理する必要があります。これは、OnSuccess および OnComplete AjaxOptions がまったく起動されないためです (おそらく何らかのコードによって上書きされます)。

于 2010-11-16T08:41:39.817 に答える