Создайте всплывающее окно с данными частичного просмотра asp.net mvc5

Question

У меня есть панель, содержащая список заданий с их идентификаторами и названиями. Его просто простой вид и простой контроллер, чтобы пойти с ним.

public ActionResult Index() 
    { 
     ViewBag.menuItem = "DashBoard"; 
     return View(db.jobs.ToList()); 

    } 

элементы в списке:

<li class="list-group-item"> @item.ID @item.Title</li> 

я создал контроллер детали, чтобы отобразить частичный вид этой работы:

[HttpGet] 
    public ActionResult Details (int jobID) 
    { 

     var details = db.details.Find(jobID); 
     return PartialView(details); 
    } 

и просто вид sandard пойти с ним , используя строительные леса.

Как добавить ссылку на действие в этот список, который отобразит всплывающее окно, когда будет нажата информация о задании, соответствующая его идентификатору.

Answer 1

Под всплывающей коробкой вы имеете в виду модальные? Если да, то:

Изменить эту часть вашего списка

<li class="list-group-item"><a data-id="@item.ID" href="#">@item.Title</a></li> 

Я собираюсь предположить, что вы используете JQuery и Bootstrap? Если нет, я приведу ссылки ниже и проведу их.

$('.list-group-item a').click(function(){ 
    //gets the id for the selected list item 
    var itemId = $(this).data("id"); 

    //performs an ajax call to the controller to get the details based on the id selected 
    $.ajax({ 
    url : 'your controller url', 
    type : 'POST', 
    data : { 
     'jobID' : itemId 
    }, 
    dataType:'json', 
    success : function(data) {    
     //append the results to your modal's body. 
     //$("modal selector").modal('show'); 
    }, 
    error : function(error) 
    { 
     //do something with the error 
    } 
    }); 
}); 

Ссылки на Bootstrap Modals и jQuery