Question

我一直在使用Grid.Mvc显示一些记录，但随着越来越多的属性被添加到模型中，网格变得丑陋而且太忙了。

所以我重新审视了Grid.Mvc文档页面，并在提供的演示中意识到：

http://gridmvc.azurewebsites.net/

他们在页面右侧div标题订单详情下整齐地显示记录的完整详细信息，这意味着实际网格不会陷入困境更精细的细节。

我想在我的项目中实现这个，但是我无法弄清楚它是如何工作的，似乎没有我可以找到解释这个的网站上的文档，即使它似乎在他们展示的每个例子中使用。当我单击查看源时，我看不到有关如何每行异步检索数据的任何来源。

如何根据链接的示例为每个选定的行添加详细信息部分？

编辑：对象即时传回JSON

public class MasterEmailViewModel
{
    public int EmailId { get; set; }
    public int MvpId { get; set; }
    public string FirstName { get; set; }
    public string Surname { get; set; }

    public string AddressLineOneOld { get; set; }
    public string AddressLineTwoOld { get; set; }
    public string AddressLineThreeOld { get; set; }
    public string AddressLineFourOld { get; set; }
    public string AddressLineFiveOld { get; set; }
    public string PostcodeOld { get; set; }

    public string AddressLineOneNew { get; set; }
    public string AddressLineTwoNew { get; set; }
    public string AddressLineThreeNew { get; set; }
    public string AddressLineFourNew { get; set; }
    public string AddressLineFiveNew { get; set; }
    public string PostcodeNew { get; set; }

    public bool IsChecked { get; set; }
    public string Comment { get; set; }

    //navigation prop
}

Answer 1

我和我的一个项目做了完全相同的事情。

示例只是使用jquery $post

查看

<div class="row"> <div class="col-md-3 col-md-push-9"> <h4>Order details </h4> <div id="emailId"> <p class="muted"> Select order to display detailed infomation </p> </div> <div id="firstNameId"> </div> </div> <div class="col-md-9 col-md-pull-3"> //Grid stuff </div> </div>

<强> JS

$(function () { // ordersGrid is what you called your Grid e.g. @Html.Grid(Model).Named("ordersGrid") pageGrids.ordersGrid.onRowSelect(function (e) { $.post("/Home/GetOrder?id=" + e.row.OrderID, function (data) { if (data.Status <= 0) { alert(data.Message); return; } // Replace the data $("#emailId").html(data.EmailId); $('#firstNameId').html(data.FirstName); }); }); });

<强>控制器

[HttpPost] public ActionResult GetOrder(int id) { // Get the data return Json(data); }

Grid MVC如何添加详细信息部分

1 个答案: