jQueryを使用してHtml.Gridのコンテンツを再バインドする方法は？

Question

私はちょうど私のプロジェクトのためGrid.mvcパッケージをインストールし、基本的なグリッドを描画するHtml.Gridメソッドを使用：ここでは

@Html.Grid(Model).Named("FeedbackGrid").Columns(columns => 
{ 
    columns.Add(c => c.Id).Titled("Request Number").SetWidth("10%"); 
    columns.Add(c => c.AspNetUser.FullName).Titled("Requester").Filterable(true).SetWidth("15%"); 
    columns.Add(c => c.RequestedDate).Titled("Date Requested").SetWidth("15%"); 
    columns.Add(c => c.Title).Titled("Title").SetWidth("20%"); 
    columns.Add(c => c.Description).Titled("Description") 
     .RenderValueAs(c => c.Description.Substring(0, (c.Description.Length > 50) ? 50: c.Description.Length) 
      + ((c.Description.Length > 50) ? "..." : "")).SetWidth("40%"); 
     }).WithPaging(10).Sortable(true) 

は私のモデルである：

@model IEnumerable<MyProject.Models.FeatureRequest> 

私は画面上にいくつかの検索機能を入れています（ID、名前などのようなもの）を検索ボタンで表示します。検索がクリックされると、jqueryは新しいデータをアクションメソッドから取得し、ビューに返します（モデルと同じタイプ）。これは私が立ち往生している場所です。私は、新しく取得したデータを使ってグリッドに再投入する方法を知らない。以下はそのコードです。どんな助けでも大歓迎です。

var onSearchClicked = function(){ 
    var requestId = $('#RequestIdSearch').val(); 
    var requesterId = $('#RequesterIdSearch').val(); 
    var title = $('#TitleSearch').val(); 
    var description = $('#DescriptionSearch').val(); 

    $.ajax({ 
     cache: false, 
     type: "POST", 
     url: "/Home/GetFeatureRequests", 
     data: { "requestId": requestId, "requesterId": requesterId, "title": title,"description": description}, 
     success: function (rdata) { 
      // How to bind the grid to the retrieve rdata here? 
      alert('successful'); 
     }, 
     error: function (xhr, ajaxOptions, thrownError) { 
      alert('Failed to retrieve request features!.'); 
     } 
    }); 
} 

Answer 1

Partial Viewの内側にあなたのHTML.Gridを入れてください。そして、このようなあなたのコントローラからPartial Viewを返す：

public PartialViewResult GetFeatureRequests(int requestId, int requesterId, string title, string description) 
{ 
    // Your code here to fill model IEnumerable<MyProject.Models.FeatureRequest> 
    return PartialView("_PartialViewName", model); // returns view with model 
} 

をajax success functionでは、次の操作を行います。

$.ajax({ 
    cache: false, 
    type: "POST", 
    url: "/Home/GetFeatureRequests", 
    data: { "requestId": requestId, "requesterId": requesterId, "title": title,"description": description}, 
    success: function (rdata) { 
     $('#yourContainerId').html(rdata); 
    }, 
    error: function (xhr, ajaxOptions, thrownError) { 
     alert('Failed to retrieve request features!.'); 
    } 
}); 

をあなたのメインビューでは、

<div id="yourContainerId"> 
    @Html.Partial("_PartialViewName", Model.FeatureRequestList) 
</div>