実行前にリンククリックでポップアップ結果を待つ

Question

私はASP.NET MVCプロジェクトに取り組んでおり、実行する前にカスタム属性を持つすべてのリンクにカスタムの確認ボックスを表示したいと思います。
これらのリンクは、このような異なるdata-ajax-success属性を持つajaxリンクすることができます。したがって、私は待つことができるだろう方法をご希望の

<a href="/OtherController/OtherAction/3ebdb11e-7994-424c-9818-6c577e56c7af"></a> 

：

<a data-ajax="true" data-ajax-failure="OnAjaxError" data-ajax-method="POST" data-ajax-success="OnAjaxSuccess(data, "updatePanel")" href="/Controller/Action/2cda26be-e6d9-416b-ae5a-ec85280fb1da"></a> 

またはこのような単純なリンクポップアップの結果を確認し、正しいパラメータ（特にajaxリンクの場合はdata-ajax-successとdata-ajax-failure）を指定して実行を続けます。
は、私は、これはそのような何かのように見えると思います：

$(document.body).on('click', 'a[data-confirmation]:not([data-confirmation=""]), *[data-confirmation]:not([data-confirmation=""]) a', 
    function (event) { 
     //pause the event 

     ShowYesNoPopup("My title", "My content", 
      function() { 
       //continue event 
      }, 
      function() { 
       event.preventDefault(); 
       return false; 
      } 
     ); 
    } 
); 

ShowYesNoPopupで：

function ShowYesNoPopup(title, content, yesCallback, noCallback) { 
$("#popupOuterContainer").empty(); 
$('<div id="popupContainer"></div>').dialog({ 
    modal: true, 
    appendTo: "#popupOuterContainer", 
    closeText: '', 
    buttons:{ 
     "yes":{ 
      text:'Ok', 
      click: function() { 
       $(this).dialog("close"); 
       yesCallback(); 
      } 
     }, 
     "no":{ 
      text:'Cancel', 
      click: function() { 
       $(this).dialog("close"); 
       noCallback(); 
      } 
     } 
    }, 
    create: function (event, ui) { 
     $("body").css({ overflow: "hidden !important" }) 
    }, 
    beforeClose: function (event, ui) { 
     $("body").css({ overflow: '' }) 
    }, 
    open: function (event, ui) { 
     $(".ui-dialog-title").html(title); 
     $(this).html(content); 
    } 
}); 
} 

私はこのテーマに関する話題をたくさん読みますが、この特定の状況で働くものを見つけることができませんでした。私はポップアップを呼び出す前に伝播を阻止しようとしましたが、ポップアップで再びイベントを呼び出すことができませんでしたボタン... これは不可能であり、JavaScriptのconfirmはそれを実現する唯一のオプションでした。

この場合、方法はありますか？何か不足していますか？

ありがとうございます。

UPDATE

$(document.body).on('click', 'a[data-confirmation]:not([data-confirmation=""]), *[data-confirmation]:not([data-confirmation=""]) a', 
function (event) { 
    event.preventDefault(); 

    if (should_do_ajax) { 
     func_callback = function() { 
      var url = $(this).attr('href'); 
      var successCallback = $(this).data("ajax-success"); 
      var failureCallback = $(this).data("ajax-failure"); 
      $.ajax({ 
       type: "POST", 
       url: url, 
       success: //what should I put here ? Because successCallback I retrieved from the link is a string, not a real function I think 
       error: //same issue 
      }); 
     } 
    } else { 
     func_callback = function() { 
      link = $(this).attr('href'); 
      window.location = link; 
     } 
    } 

    ShowYesNoPopup("My title", "My content", 
     func_callback, 
     function() { 
      return false; 
     } 
    ); 
} 

）。そのあなたのケースで（あなたのアクションのデフォルトの動作がトリガされます -

Answer 1

ShowYesNoPopup機能が終了した（とあなたがevent.preventDefault()を呼び出しますしない限り、それはあなたのコードがclickイベントに戻っdialog()への呼び出しの直後に起こる、としたらブラウザをそのページに変更させるリンククリックを引き起こします）

デフォルトの動作を防ぐことから始めて、yesCallbackがこの動作をエミュレートする関数であることを確認してください。 - window.location = $(this).attr('href')）

$(document.body).on('click', 'a[data-confirmation]:not([data-confirmation=""]), *[data-confirmation]:not([data-confirmation=""]) a', 
    function (event) { 
     event.preventDefault(); 
     if (should_do_ajax) { 
      func_callback = function() { 
       $.ajax({ 
       ... 
       }); 
      } 
     } else { 
      func_callback = function() { 
       link = $(this).attr('href'); 
       window.location = link; 
      } 
     } 


     ShowYesNoPopup("My title", "My content", 
      func_callback, 
      function() { 
       return false; 
      } 
     ); 
    } 
); 

yesCallback機能の内容を、あなたが持っているdata-*の値（ajax call/something else）に従って変更する必要があります。