JQuery - アンカーリンクにモーダルダイアログを表示する必要があります。ページをクリックしてください。

Question

私のかみそりのビューでは、アンカーでテーブルを取得しています。以下に示すセルの1つ：

ユーザーがいずれかのアンカーをクリックすると、私はモーダルダイアログを表示する必要があります。どうすればこれを達成できますか？

Answer 1

ので、： - あなたが望んでいない可能性がどのようなすべてのアンカーは、ページ上でクリックしたため

$('a').click(function(e) { 
    alert('anchor clicked'); 
}); 

あなたはそのアラートを取得したいです。

$('a.myclass').click(function(e) { 
    alert('anchor clicked'); 
}); 

をして、あなたはそのクラスであっただけで、アンカーのアラートを取得したい：あなたはそれらのアンカークラスを割り当てた場合、あなたはこれを行うことができます。モーダルダイアログボックスでは、アラートを取得した場所を代わりに使用して、モーダルダイアログとして使用するためにページに隠しdivを作成することができます。私はこのようなことをして、それは何かのように見えた：

$('a.myclass).click(function() { 
    // add the div or reuse it 
    var modaldialog = ($('#ModalDialog').length > 0) 
    ? $('#ModalDialog') 
    : $('<div id="ModalDialog" style="display:hidden"></div>').appendTo('body'); 
    load up data via ajax call 
    $.get('@Url.Action("MyAction", "MyController")', {}, 
     function (responseText, textStatus, XMLHttpRequest) { 
     modaldialog.html(responseText); 
     modaldialog.dialog({ 
      modal: true, 
      width: 500, 
      title: 'My Modal Dialog', 
     }); 
     } 
    ); 
}); 

とにかく、それはスタートです。あなたはダイアログにボタンを追加することもできますし、それらはあなたの特定のニーズが何であれに基づいて行います。

Answer 2

アンカーにid（jQueryのパフォーマンス）を与え、インスタンスをAjax経由でモーダルダイアログを取得した後、falseを返すクリックイベントをバインドすることができます（JavaScriptが無効の場合、ダイアログを表示する必要があります）あなたはこのような何かをした場合）