從Ajax調用填充Webgrid

Question

我從Ajax調用填充Webgrid時遇到問題。

我按照以下線程中顯示的示例進行操作：mvc3 populating bind webgrid from ajax但是，這並未產生任何結果。

當我運行網站時，我總是收到消息：「Error：undefined」。

在調試代碼時，我確信問題在於返回PartialView是問題，因爲我的Ajax成功方法中的數據對象沒有被數據填充。

這裏是我的代碼示例：

Ajax調用：

$.fn.getCardResult = function (leerling, kaart) { 
     $.ajax({ 
      type: "GET", 
      url: '@Url.Action("GetResults","Kaarten")', 
      data: { leerlingID: leerling, cardID: kaart }, 
      cache: false, 
      success: function (data) { 
       console.log(data); 
       if (!data.ok) { 
        window.alert(' error : ' + data.message); 
       } 
       else { 
        $('#card').html(data); 
       } 
      } 
     }); 
    } 

部分查看呼叫：

<div class="card-content" id="card"> 
    @{ 
     if(Model.Kaart != null && Model.Kaart.Count > 0) 
     { 
      @Html.Partial("_Kaarten") 
     } 
     else 
     { 
      @: Er zijn geen kaarten beschikbaar. 
     } 
    } 
</div> 

管窺：

@model List<ProjectCarrousel.Models.KaartenModel> 

@{ 
    var grid = new WebGrid(source: Model,ajaxUpdateContainerId: "card", 
     defaultSort: "Topicname"); 

    grid.GetHtml(
     tableStyle: "webgrid", 
     columns: grid.Columns(
      grid.Column("Topicname", "Topic"), 
      grid.Column("Taskname", "Taken"), 
      grid.Column("Taskpoints", "Punten"), 
      grid.Column("Grades", "Resultaat"), 
      grid.Column("Date", "Datum"), 
      grid.Column("Teachercode", "Paraaf Docent") 
     ) 
    ); 
} 

控制器代碼：

public ActionResult GetResults(int leerlingID, string cardID) 
    { 
     try 
     { 
      int Ovnumber = leerlingID; 
      string CardId = cardID; 

      List<KaartenModel> kaartlijst = new List<KaartenModel>(); 


      IEnumerable<topic> topics = _db.topic.Include("tasks.studenttotask").Where(i => i.CardID == CardId); 
      foreach (topic topic in topics) 
      { 
       foreach (tasks task in topic.tasks) 
       { 
        KaartenModel ka = new KaartenModel(); 

        ka.Topicname = task.topic.Topicname; 
        ka.Taskname = task.Taskname; 
        ka.Taskpoints = task.Taskpoints; 
        ka.Ranks = task.Ranks; 
        ka.Date = task.studenttotask.Where(i => i.Ovnumber == Ovnumber).Select(d => d.Date).SingleOrDefault(); 
        ka.Grades = task.studenttotask.Where(i => i.Ovnumber == Ovnumber).Select(d => d.Grades).SingleOrDefault(); 
        ka.Teachercode = task.studenttotask.Where(i => i.Ovnumber == Ovnumber).Select(d => d.Teachercode).SingleOrDefault(); 
        kaartlijst.Add(ka); 
       } 
      } 

      KVM.Kaart = kaartlijst; 

      return PartialView("_Kaarten", KVM.Kaart); 

     } 
     catch (Exception ex) 
     { 
      return Json(new { ok = false, message = ex.Message }); 
     } 
    } 

如果有人能幫助它將不勝感激。

UPDATE

擺弄了一下後，我發現我工作的解決方案。下面是一個更新的Ajax呼叫片段：

我找到的解決方案也是以另一種方式製作Success方法。這確保了部分視圖正確呈現。以下是Ajax調用代碼片段。

$.ajax({ 
    url: '@Url.Action("GetAjaxCall","Home")', 
    contentType: 'application/html; charset=utf-8', 
    type: 'GET', 
    dataType: 'html', 
    data: { id: id }, 
}) 
.success(function (result) { 
    $('#sectionContents').html(result); 
}) 
.error(function (xhr, status) { 
    alert(xhr.responseText); 
}); 

Answer 1

我找到的解決方案也是以另一種方式使Success方法成功。這確保了部分視圖正確呈現。以下是Ajax調用代碼片段。

$.ajax({ 
    url: '@Url.Action("GetAjaxCall","Home")', 
    contentType: 'application/html; charset=utf-8', 
    type: 'GET', 
    dataType: 'html', 
    data: { id: id }, 
}) 
.success(function (result) { 
    $('#sectionContents').html(result); 
}) 
.error(function (xhr, status) { 
    alert(xhr.responseText); 
});