如何从 jquery-datatable 中选择一行，从控制器获取更多数据并将它们显示在表下?(MVC4)

本文关键字：MVC4 显示 多数据 控制器 选择 jquery-datatable 获取 一行 | 更新日期: 2023-09-27 18:32:21

我有一个MVC4项目，我正在使用jquery/Datatables-plugin。

我有一个具有下一个属性的视图模型： 

public IEnumerable<Invoice> Invoices { get; set; }
public IProcessResult Result { get; set; }
public Invoice Invoice { get; set; }

数据表显示所有发票（来自模型。发票），在此表下，我显示了所选发票的发票详细信息（以及其他一些信息，如图像）。

现在，我想在数据表中显示所选发票的发票详细信息（单击发票后）。在此之前，我必须初始化一些数据（在控制器中）。

我有这个javascriptcode：

$(document).ready(function () {
    $('#invoicesoverview tr').click(function () {
      oTable.$("tr.row_selected").removeClass("row_selected");
      $(this).toggleClass('row_selected');
    });
    var oTable = $('#invoicesoverview').dataTable({
        "bPaginate": true,
        "iDisplayLength": 10,
        "bSort": false,
        "bFilter": false,
        "bResetDisplay": false,
        "bServerSide": false,
        "bProcessing": true
    });
    oTable.$("tr:first").trigger("click");
}

我是"MVC4 启动器"，所以我不知道下一步该怎么做。我想我必须从点击事件调用 ajax 调用，但我不知道该怎么做。

如何从 jquery-datatable 中选择一行，从控制器获取更多数据并将它们显示在表下?(MVC4)

我的做法是首先获取单击的行的 id。 这是一个链接，讨论在表 -HTML 中获取所选行的 ID。 然后在单击函数中添加 ajax 调用

$.ajax({
     url: "@(Url.Action("Details", "Controller", new { id = "----" }))/".replace("----", id),
     type: "POST",
     cache: false,
     async: true,
     success: function (result) {
          $(".DetailsDiv").html(result);
     }
 });

创建分部视图以显示控制器中单击的行的详细信息

[HttpPost]
    public PartialViewResult Details(string id)
    {
         Model model = (populate your data);
         return PartialView("_PartialView", model);
    }

希望这有所帮助。

相关文章：