如何在 Asp.Net MVC3 中返回 Json 结果时填充 WebGrid

Question

我的应用程序位于 Asp.Net MVC3 中，Razor View Engine 是用 C#.Net 编码的。我想在我的 Asp.Net MVC3 视图中填充 WebGrid。

但我的要求是我想在选择一些下拉菜单时显示 WebGrid。 下面是我的 Json

[AcceptVerbs(HttpVerbs.Get)]
        public JsonResult getPendingInvoices(Int64 candID, DateTime InDate)
        {
            Int64 timeId;
            var getTimeSheetId= from k in db.TimeSheetInfoes
                             where k.PersonalInformationID == candID && k.TimeSheetDate == InDate && k.InvoicedFlag == false
                             select k.TimeSheetID;

            timeId = getTimeSheetId.Single();

            var getInvoice = (from K in db.TimeSheetTasks
                              where K.TimeSheetID == timeId
                              select new TimeSheetsTaskClass { TaskInfoId =(Int64)K.TimeSheetID, Task = K.Task, TaskDateDay = (DateTime)K.TaskDate, ProjectNameDay = K.ProjectName, Day=K.Day, TaskHours = (decimal)K.TaskHours, ApprovingManager = K.ApprovingManager, OTHours = (decimal)K.OTHours }).ToList();

            return Json(getInvoice, JsonRequestBehavior.AllowGet); 
        }

日期和候选人 ID 是从我选择的值传递的。 下面是我的 Jquery。

 $("#MyDropdown").live("change", function () {

            $.getJSON("/../Invoice/getPendingInvoices", { candID: $("#ddlCandidateDispName").attr("value"), InDate: $("#dtpInvoiceDate").val() }, function (data) {
                $.each(data, function (i, TimeSheetsTaskClass) {

                });
                grid = new WebGrid(Model);
            });
        }
    });

这是我尝试过的。 我想用 TimeSheetsTaskClass 中的数据填充 WebGrid。 下面是我的控制器中的 TimeSheetsTaskClass

public class TimeSheetsTaskClass
        {
            public Int64 TaskInfoId { get; set; }
            public string Task { get; set; }
            public DateTime TaskDateDay { get; set; }
            public string ProjectNameDay { get; set; }
            public string Day { get; set; }
            public Decimal TaskHours { get; set; }
            public decimal OTHours { get; set; }
            public string ApprovingManager { get; set; }
        }

下面是我如何使用我的类

@model IEnumerable<RecruitmentPortal.Controllers.InvoiceController.TimeSheetsTaskClass>

下面是我如何声明 WebGrid 变量。

var grid = new WebGrid(Model);

下面是我如何在 cshtml 中显示我的 webGrid。

<div id="grids">
@grid.GetHtml()
</div>

请指导我如何在 WebGrid 中显示数据。

Answer 1

使用 WebGrid 无法做到这一点。它期待一个模型。因此，您可以返回包含网格代码的部分视图，而不是从控制器操作返回 JSON：

return PartialView("_Grid", getInvoice); 

然后：

$(document).delegate('#MyDropdown', 'change', function() {
    var url = '@Url.Action("getPendingInvoices", "Invoice")';
    var data = { 
        candID: $('#ddlCandidateDispName').val(),
        inDate: $('#dtpInvoiceDate').val() 
    };
    $('#gridContainer').load(url, data);
});

其中 gridContainer 可以是包含网格的 div：

<div id="gridContainer">
    @Html.Partial("_Grid")
</div>

您可能还会注意到我已经替换了 .live()< /code> 与 .delegate()。如果您使用的是 jQuery 1.7+，您应该使用 .on()。