Как заполнить WebGrid при возврате результата Json в Asp.Net MVC3

Question

Мое приложение находится в Asp.Net MVC3 с Razor View Engine, написанным на C # .Net.Я хочу заполнить WebGrid в моем Asp.Net MVC3 View.

Но мое требование - я хочу показать WebGrid при выборе некоторых dropDowns.Ниже мой 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); 
        }

Дата и Идентификатор кандидата передаются из моих выбранных значений.Ниже мой 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);
            });
        }
    });

Это то, что я пытался.Я хочу заполнить свою WebGrid данными в моем TimeSheetsTaskClass.Ниже мой 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);

НижеВот как я показываю мою webGrid в моем cshtml.

<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, содержащимgrid:

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

Вы также можете заметить, что я заменил .live() на .delegate().Если вы используете jQuery 1.7+, вы должны использовать .on().