在MVC中使用jqGrid滾動時自動載入數據

我的問題是，在試圖實現自動載入功能的使用時，我無法讓GET請求對我的操作嘗試加載下一組數據。滾動在MVC中使用jqGrid滾動時自動載入數據

是什麼時候自動加載 - 第一個初始負載正常工作

我嘗試以下這裏http://trirand.com/blog/jqgrid/jqgrid.html

該功能在3.4版本製作新的左手側的條目中列出的例子這裏的錯誤？

這裏是我的js代碼電網

<script type='text/javascript'> 
$(document).ready(function() 
{ 
    $('#gvEmps').jqGrid(
    { 
     url:'RecordEmpGrid', 
     datatype: 'json', 
     colNames:['Select Training(s)'], 
     colModel : 
     [ 
     {name: 'Select Training(s)', index: 'TrainingName', width: '300', align: 'Left'} 
     ], 
    rowNum: 15, 
    scroll: true, 
    rowList:[10,20,30], 
    pager: '#gvEmpsPager', 
    sortname: 'TrainingName', 
    viewrecords: true, 
    sortorder: 'desc', 
    jsonReader: 
    { 
     repeatitems : true, 
    }, 
    caption: '' 
}); 
}); 
</script>

的Html

<table id="gvEmps" class="SGrid scroll"></table> 
<div id="gvEmpsPager" class="scroll"></div>

控制器

//will never hit this action when scrolling, only first time on page load 
    [HttpGet] 
    public ActionResult RecordEmpGrid(string sidx, string sord, int page, int rows) 
    { 
     var gr = new GridResult(sidx, sord, page, rows); 
     var skip = rows * page - rows; 
     DataTable dt = null; 
     using (var mr = new MultipleRecords(Product.Utility, "evaluateSql")) 
     { 
      mr["sql"] = "SELECT * FROM TT.Training WHERE CompanyId = 190 ORDER BY TrainingName ASC"; 
      dt = mr.GetDataTable(); 
     } 
     gr.Total = dt.Rows.Count; 
     var records = new MultipleRecords(dt); 
     foreach (var row in records.Skip(skip).Take(rows)) 
     { 
      gr.AddDataRow(new []{row["TrainingTypeID"].String, row["TrainingName"].String }); 
     } 
     return Json(gr.Data, JsonRequestBehavior.AllowGet); 
    }

我的JSON包裝對象

public class GridResult 
{ 
    private List<object> m_rowData = new List<object>(); 

    private string m_order; 
    private string m_idx; 
    private int m_rows; 
    private int m_page; 

    public int Total { get; set; } 

    public GridResult() 
    { 

    } 

    public GridResult(string sidx, string sord, int page, int rows) 
    { 
     m_idx = sidx; 
     m_order = sord; 
     m_page = page; 
     m_rows = rows; 
    } 

    public void AddDataRow(object[] columnData) 
    { 
     m_rowData.Add(columnData); 
    } 

    private object m_data; 
    public object Data 
    { 
     get 
     { 
      return m_data ?? (m_data = BuildData()); 
     } 
    } 

    protected object BuildData() 
    { 
     var id = 1; 
     return new 
     { 
      total = Total, 
      page = m_page++, 
      records = m_rows, 
      rows = (from row in m_rowData 
        select new 
        { 
         id = id++, 
         cell = row 
        } 
        ).ToArray() 
     }; 
    } 
}

來源

2011-09-02 Feisty Mango

問題出在我的json幫手對象中。我責怪這個不好的命名約定，但看起來我正在混合記錄&總參數。

切換這兩個問題解決了這個問題。

這是一個很好的鏈接，引導我發現。這個人是一個jqGrid大師。

http://blogs.teamb.com/craigstuntz/2009/04/15/38212/

來源

2011-09-03 07:22:29

您在ajax調用中缺少控制器名稱（url：'/ controllername/actionname'）我希望能解決您的問題。

來源

2011-09-03 00:06:07 solkim

抱歉，我忘了提，但我只是用一些自定義的路由，讓我在這個特殊的情況下離開控制器的名字。請記住，它加載第一組記錄的罰款，它只是在滾動期間的自動加載完全失敗。 –

你有沒有視圖名稱作爲RecordEmpGrid？ – solkim

不，視圖的名稱是Record.cshtml –

這裏是一個完整的工作示例我爲你寫了，我已經硬編碼的值，但你可以修改它很容易滿足您的需求。

控制器：

public class HomeController : Controller 
{ 
    public ActionResult Index() 
    { 
     return View(); 
    } 

    public ActionResult RecordEmpGrid(string sidx, string sord, int page, int rows) 
    { 
     var gr = new GridResult(sidx, sord, page, rows); 
     var skip = rows * page - rows; 
     gr.Total = 75; 
     foreach (var item in Enumerable.Range(1, gr.Total).Skip((page - 1) * rows).Take(rows)) 
     { 
      gr.AddDataRow(new[] { string.Format("TrainingName: {0}", item) }); 
     } 
     return Json(gr.Data, JsonRequestBehavior.AllowGet); 
    } 
}

查看：

@{ 
    Layout = null; 
} 

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <title></title> 
    <style type="text/css"> 
     table { 
      border: solid 1px #e8eef4; 
     } 
    </style> 
    <link href="@Url.Content("~/scripts/jqgrid/css/ui.jqgrid.css")" rel="stylesheet" type="text/css" /> 
    <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script> 
    <script src="@Url.Content("~/scripts/jqgrid/js/i18n/grid.locale-en.js")" type="text/javascript"></script> 
    <script src="@Url.Content("~/scripts/jqgrid/js/jquery.jqGrid.min.js")" type="text/javascript"></script> 
    <script type="text/javascript"> 
     $(function() { 
      $('#gvEmps').jqGrid({ 
       url: '@Url.Action("RecordEmpGrid")', 
       datatype: 'json', 
       colNames: ['Select Training(s)'], 
       colModel: [ 
        { name: 'Select Training(s)', index: 'TrainingName', width: '300', align: 'Left' } 
       ], 
       rowNum: 10, 
       scroll: true, 
       rowList: [10, 20, 30], 
       pager: '#gvEmpsPager', 
       sortname: 'TrainingName', 
       viewrecords: true, 
       sortorder: 'desc', 
       jsonReader: { 
        repeatitems: true 
       }, 
       caption: '', 
       height: 100 
      }); 
     }); 
    </script> 
</head> 
<body> 
    <table id="gvEmps"></table> 
    <div id="gvEmpsPager"></div> 
</body> 
</html>

來源

2011-09-03 08:00:49

在MVC中使用jqGrid滾動時自動載入數據

回答

相關問題