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

时间:2012-02-20 07:41:14

标签: asp.net-mvc-3

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

但我的要求是我想在选择一些dropDowns时显示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中的Data填充我的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; }
        }

以下是我如何使用我的课程

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

以下是im声明WebGrid变量的方法。

var grid = new WebGrid(Model);

以下是我在cshtml中显示我的webGrid的方法。

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

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

1 个答案:

答案 0 :(得分:3)

您不能使用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()替换为.delegate()。如果您使用的是jQuery 1.7+,则应使用.on()