javascript - asp.net mvc 使用 Javascript 渲染局部 View

标签 javascript ajax asp.net-mvc razor

我想制作一个在表格中显示数据的分部 View 。

我将有一个 Select 元素,其中包含可供选择的服务。

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

我该怎么做?

这是一个将呈现 partialView 的操作方法

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

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

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

最佳答案

你可以使用 $.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);                 
            }
         });           
     });

此外,您应该返回部分 View 而不是 View

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

关于javascript - asp.net mvc 使用 Javascript 渲染局部 View ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22064162/

相关文章:

javascript - 如何通过ajax函数发送数据到php文件?

asp.net-mvc - 为什么这两个 API 方法会产生冲突

javascript - MVC 中表格上的自定义工具提示 - 显示每行数据

javascript - Colorbox的tabindex =“-1”属性可防止在表单字段上进行焦点和键入

javascript - socket.emit() 的范围是什么?

php - 在 laravel 5 中发送 ajax 请求

javascript - 从 Javascript 传递时,Ajax 数据不会在 PHP 中打印

javascript - 寻找使用 Javascript 从 Kendo UI timepickers 中减去时间的更好替代方法

javascript - 如何使用 sinon.js stub 链接函数

c# - MVC 4 中的只读属性