1

asp.net MVC3 アプリケーションの jQuery ajax 機能で奇妙な動作が発生しています。

ポップアップを開いて各ボックスのデータを変更するためのリンクを含むデータのボックスがいくつかあります。これを行うためにlive()、jQuery ajax 呼び出しを介してデータを処理する jquery クリック イベントを追加しました。ajax 呼び出しの「成功」メソッドで、返されたデータを取得し、ラジオ ボタンのリストを含む UI ダイアログ ポップアップ (部分ビュー) を開きます。別のラジオ ボタンを選択して「閉じる」を押します。閉じるボタンは別のlive()クリック イベントを発生させ、メイン ページのボックス内のデータを更新する ajax 呼び出しを介してその新しいデータを処理します。

これは初めて完全に機能します。次にクリックして再度変更すると、ポップアップが開き、新しい値を選択できますが、今回はポップアップを閉じると2つのクリックイベントがトリガーされ、MVCコントローラーでnullエラーがスローされます。

このプロセスを繰り返すと、3 つのクリック イベントがトリガーされるため、live()これらのイベントがどこかに追加されていることは明らかです。

と を使用してみましon()たclick()が、ページ自体は ajax 経由で読み込まれたパネルで構成されているためlive()、イベントを自動的にバインドしていました。

私が使用しているコードは次のとおりです。

HTML

<p><!--Data to update goes here--></p>
<a href="#" class="adjust">Update Data</a>

部分ビューでポップアップを呼び出す First Click イベント

$('a.adjust').live('click', function (e) { 
    var jsonData = getJsonString(n[1]);
    var url = '@Url.Action("ChangeOptions", "Search")';
    var dialog = $('<div id="ModalDialog" style="display:none"></div>').appendTo('body');
    // load the data via ajax
    $.ajax({
        url: url,
        type: 'POST',
        cache: false,
        contentType: "application/json; charset=utf-8",
        data: jsonData,
        success: function (response) {
            dialog.html(response);
            dialog.dialog({
                bgiframe: true,
                modal: true
                }
            });
        }
    });
    e.preventDefault();
});

新しい情報を取得して更新された部分ビューを返す 2 番目のクリック イベント

$('a#close').live('click', function (event) { 
    var jsonData = getJsonString(n[1]);
    var url = '@Url.Action("GetChangeInfo", "Search")';
    $.ajax({
        url: url,
        type: 'POST',
        contentType: "application/json; charset=utf-8",
        data: jsonData,
        success: function (response) {
            $('#box-' + @column).html(response);  //this refreshes the box on the main page
        },
        error: function () {
        }
    });
    $('#ModalDialog').dialog('close');
    event.preventDefault();
});

ここで何が起こっているのか、どうすれば解決できるか知っている人はいますか?

4

2 に答える 2

2

名前空間を使用して、次のように以前のクリック バインドをバインド解除します。

$('a.adjust').unbind('click.adjustclick');

次に、クリック アクションを a.adjust にバインドします。

$('a.adjust').bind('click.adjustclick', function(){

  //your code here

  //note the return false, this prevents the browser from visiting the URL in the href attribute
  return false;
});

私があなたを正しく理解していれば、ダイアログが閉じられたときに 2 番目のクリック アクションを実行しようとします。そのため、次のように、ダイアログに組み込みのクローズ機能を使用します。

$('a.adjust').bind('click.adjustclick', function(){
    var jsonData = getJsonString(n[1]);
    var url = '@Url.Action("ChangeOptions", "Search")';
    var dialog = $('<div id="ModalDialog" style="display:none"></div>').appendTo('body');
    // load the data via ajax

    $.ajax({
        url: url,
        type: 'POST',
        cache: false,
        contentType: "application/json; charset=utf-8",
        data: jsonData,
        success: function (response) {
            dialog.html(response);
            dialog.dialog({
                bgiframe: true,
                modal: true,
                close: function(){
                    var jsonData2 = getJsonString(n[1]);
                    var url2 = '@Url.Action("GetChangeInfo", "Search")';

                    $.ajax({
                        url: url2,
                        type: 'POST',
                        contentType: "application/json; charset=utf-8",
                        data: jsonData2,
                        success: function (response2) {
                            $('#box-' + @column).html(response2);  //this refreshes the box on the main page
                        },
                        error: function () {
                        }
                    });
                  }
                }
            });
        }
    });
});

独自のボタン a#close を使用している場合は、クリック イベントをバインドしてダイアログを閉じると、ダイアログの閉じる関数が自動的に起動されます。

$('a#close').unbind('click.closedialog');
$('a#close').bind('click.closedialog', function () {
  $('#ModalDialog').dialog('close');
  return false;
}
于 2012-10-04T09:34:36.613 に答える
0

これを試して：

$('a#close').unbind('click').bind('click', function (event) {
//Your Code
});
于 2012-10-04T09:08:41.047 に答える