Jsonの返品時にWebGridを塗りつぶす方法Asp.Net MVC3の結果

Question

私のアプリケーションは、C＃.NetでコーディングされたRazor View Engineを搭載したAsp.Net MVC3にあります。私は私の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); 
      }); 
     } 
    }); 

これは私が試みたものです。 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; } 
     } 

の私TimeSheetsTaskClassは以下

@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); 

をそして：

gridContainerは、グリッドを含むdivの可能性があり

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

：

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

また、.live()を.delegate()に置き換えたことに気づくことがあります。 jQuery 1.7+を使用している場合は、.on()を使用してください。