asp.net-mvc-3 - 如何在 Asp.Net MVC3 中返回 Json 结果时填充 WebGrid

Question

我的应用程序在 Asp.Net MVC3 中，Razor View Engine 以 C#.Net 编码。我想在我的 Asp.Net MVC3 View 中填充 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。下面是我 Controller 中的 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; }
        }

下面是我如何使用我的类(class)

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

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

var grid = new WebGrid(Model);

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

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

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

Answer 1

WebGrid 无法做到这一点。它需要一个模型。因此，您可以返回包含网格代码的部分 View ，而不是从您的 Controller 操作返回 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() 替换为 .delegate()。如果您使用的是 jQuery 1.7+，您应该使用 .on()。