asp.net mvc使用Java Script渲染部分视图

Zap*_*ica 7 javascript ajax asp.net-mvc razor

我想创建一个在表中显示数据的部分视图.

我将有一个Select元素,可以选择服务.

当用户在组合框中选择服务时,我想要调用带有服务ID号的部分视图:

我怎样才能做到这一点?

这是一个动作方法,它将呈现partialView

//
// GET: /Service/ServiceStatusLogs/1
public ActionResult ServiceStatusLogs(int id)
{
   var db = new EFServiceStatusHistoryRepository();
   IList<ServiceStatusHistory> logs = db.GetAllStatusLogs(id);
   return View("_ServiceStatusLogs", logs);
 }
Run Code Online (Sandbox Code Playgroud)

这是返回页面的主要操作方法:

//
// GET: /Services/Status
public ActionResult Status()
{
  IList<Service> services;
  using (var db = new EFServiceRepository())
  {
    services = db.GetAll();
  }
   return View(services);
}
Run Code Online (Sandbox Code Playgroud)

ssi*_*777 7

您可以使用$ .ajax功能来实现,请检查: -

      //Combo box change event
      $("#comboboxName").change(function () {        
            //Get service Id 
            var serviceId = $("#comboboxName").val();

            //Do ajax call  
            $.ajax({
            type: 'GET',
            url: "@Url.Content("/Service/ServiceStatusLogs/")",    
            data : {                          
                        Id:serviceId  //Data need to pass as parameter                       
                   },           
            dataType: 'html', //dataType - html
            success:function(result)
            {
               //Create a Div around the Partial View and fill the result
               $('#partialViewContainerDiv').html(result);                 
            }
         });           
     });
Run Code Online (Sandbox Code Playgroud)

你也应该返回局部视图而不是视图

//
// GET: /Service/ServiceStatusLogs/1
public ActionResult ServiceStatusLogs(int id)
{
   var db = new EFServiceStatusHistoryRepository();
   IList<ServiceStatusHistory> logs = db.GetAllStatusLogs(id);
   return PartialView("_ServiceStatusLogs", logs);
 }
Run Code Online (Sandbox Code Playgroud)