返回json文本后Jqgrid没有绑定

时间:2013-11-25 05:20:55

标签: json jqgrid

无法绑定我的JQgrid,下面是我的代码:

尝试使用Json通过控制器将一些数据绑定到jqgrid但不能绑定网格。附上我的代码。

Controller Class:

 public class TransactionTypeController : Controller
{
    //
    // GET: /TransactionType/

    public ActionResult Index(EMM_New.Models.TransactionTypeModal TransactionType)
    {
        List<EMM_New.Models.TransactionTypeEntity> lst = TransactionType.GetTransactionType();
        ViewBag.TransactionTypeData = lst;
        return View();
    }

    public ActionResult GetGridData(string sidx, string sord, int page, int rows)
    {
        return Content(JsonHelper.JsonForJqgrid(GetDataTable(sidx, sord, page, rows), rows, GetTotalCount(), page), "application/json");
    }

    public DataTable GetDataTable(string sidx, string sord, int page, int pageSize)
    {
        int startIndex = (page - 1) * pageSize;
        int endIndex = page * pageSize;

        DataTable table = new DataTable();
        table.Columns.Add("CustomerID", typeof(int));
        table.Columns.Add("ContactName", typeof(string));
        table.Columns.Add("Address", typeof(string));
        table.Columns.Add("City", typeof(string));
        table.Columns.Add("PostalCode", typeof(string));
        //
        // Here we add five DataRows.
        //
        table.Rows.Add(25, "Ramesh", "Combivent", "Bangalore", "463456");
        table.Rows.Add(50,  "Sam", "Enebrel", "Hosur", "463456");
        table.Rows.Add(10, "Christoff", "Hydralazine", "Bangalore", "463456");
        table.Rows.Add(21, "Janet", "Combivent",  "Hosur", "463456");
        table.Rows.Add(100, "Melanie", "Dilantin", "Bangalore", "463456");
        return table;
    }

     public int GetTotalCount() {           
        return 10;
    }
}

JsonHelper Class:

public class JsonHelper
{
    public static string JsonForJqgrid(DataTable dt, int pageSize, int totalRecords, int page)
    {
        int totalPages = (int)Math.Ceiling((float)totalRecords / (float)pageSize);
        StringBuilder jsonBuilder = new StringBuilder();
        jsonBuilder.Append("{");
        jsonBuilder.Append("\"total\":" + totalPages + ",\"page\":" + page + ",\"records\":" + (totalRecords) + ",\"rows\"");
        jsonBuilder.Append(":[");
        for (int i = 0; i < dt.Rows.Count; i++)
        {
            jsonBuilder.Append("{\"i\":" + (i) + ",\"cell\":[");
            for (int j = 0; j < dt.Columns.Count; j++)
            {
                jsonBuilder.Append("\"");
                jsonBuilder.Append(dt.Rows[i][j].ToString());
                jsonBuilder.Append("\",");
            }
            jsonBuilder.Remove(jsonBuilder.Length - 1, 1);
            jsonBuilder.Append("]},");
        }
        jsonBuilder.Remove(jsonBuilder.Length - 1, 1);
        jsonBuilder.Append("]");
        jsonBuilder.Append("}");
        return jsonBuilder.ToString();
    }
}

查看:

 <table id="list" class="scroll" >
</table>
<div id="pager" class="scroll" style="text-align: center;">
</div>


<script type="text/javascript">
    jQuery(document).ready(function() {
        jQuery("#list").jqGrid({
            url: '/TransactionType/GetGridData/',
            datatHomeype: 'json',
            mtype: 'GET',
            colNames: ['Customer ID', 'Contact Name', 'Address', 'City', 'Postal Code'],
            colModel: [
              { name: 'CustomerID', index: 'CustomerID', width: 100, align: 'left' },
              { name: 'ContactName', index: 'ContactName', width: 150, align: 'left' },
              { name: 'Address', index: 'Address', width: 300, align: 'left' },
              { name: 'City', index: 'City', width: 150, align: 'left' },
              { name: 'PostalCode', index: 'PostalCode', width: 100, align: 'left' }
            ],
            pager: jQuery('#pager'),
            rowNum: 10,
            rowList: [5, 10, 20, 50],
            sortname: 'CustomerID',
            sortorder: "asc",
            viewrecords: true,
            caption: 'JqGrid from class Binding'
        }).navGrid(pager, { edit: false, add: false, del: false, refresh: true, search: true });
    });
</script>

能够看到Jqgrid,但是数据没有填充......我正在做什么。请帮我解决这个问题..

1 个答案:

答案 0 :(得分:0)

datatHomeype:'json'?

应该是数据类型:'json'

尝试改变你的json:

{"total":1,"page":"1","records":10,"rows":[{"cell":["25","Ram","Combivent","Bangalore","463456"]}]}