ASP.NET MVC ActionLink帶有JavaScript功能

Question

我有一個帶有操作鏈接的列表。所有鏈接都必須通過param在模態彈出窗口中加載局部視圖。

鏈接：

@model IEnumerable<string> 

<ul> 
    @foreach (var item in Model) 
    { 
     <li> 
      @Html.ActionLink(item, "MyAction", null, new {code = item}, new {@class = "myclass" }) 
     </li> 
    } 
</ul> 

MyAction：

public ActionResult MyAction(string code) 
{ 
    // logic 
    var model = ... 

    return PartialView("_MyPartialView", model); 
} 

我與模式彈出和JavaScript函數的觀點：

<script type="text/javascript">  
$(function() { 
    $(function() { 
     $('#my-dialog').dialog({ 
      autoOpen: false, 
      width: 400, 
      modal: true 
     }); 

     $('.myclass').click(function (e) { 
      e.preventDefault(); 
      $('#my-dialog').load(this.href, function() { 
       $(this).dialog('open'); 
      }); 
      return false; 
     }); 
    }); 
</script>  
<div id="my-dialog"></div> 

但在點擊ActionLink的JS功能不起作用和局部視圖只需加載新頁面。我試圖在這個函數中做出斷點，但是斷點不起作用，這意味着函數沒有通過點擊事件調用。感謝您的建議

Answer 1

試試這個.......

<script type="text/javascript">  
$(function() { 
    $(function() { 
     $('#my-dialog').dialog({ 
      autoOpen: false, 
      width: 400, 
      modal: true 
     }); 

      $(body).on('click','.myclass',function(e){  
      e.preventDefault(); 
      $('#my-dialog').load(this.href, function() { 
       $(this).dialog('open'); 
      }); 
      return false; 
     }); 
    }); 
</script>  
<div id="my-dialog"></div> 

Answer 2

一旦你的觀點被渲染加載的局部視圖的唯一方法是通過Ajax調用，它返回的局部視圖，以您的彈出

HTML

@model IEnumerable<string> 

<ul> 
@foreach (var item in Model) 
{ 
    <li> 
     <a onclick="showModal('@item')" class="myclass">item</a> 
    </li> 
} 

<div id="my-dialog"></div> 

jQuery的

<script type="text/javascript">  
$(function() { 
    $('#my-dialog').dialog({ 
     autoOpen: false, 
     width: 400, 
     modal: true 
    }); 

function showModal(code) { 
     $.ajax({ 
      url: "myController/MyAction?code="+code, 
      type: 'get', 
      success: function (result) { 
       $('#my-dialog').html(result); 
       $('#my-dialog').dialog('open') 
      }, 
      } 
     }); 
    } 
</script> 

操作：

public ActionResult MyAction(string code) 
{ 
// logic 
var model = ... 

return PartialView("_MyPartialView", model); 
}