没有填充数据.(总是空格子)

我建议你不要使用旧版本的jqGrid，如2.5年前发布的版本4.4.4。我建议您使用免费的jqGrid的当前版本(4.9.2)。如果您喜欢使用NuGet，那么您可以使用Install-Package free-jqGrid来安装当前版本的免费jqGrid(见这里)。有关更多信息，请参阅每个已发布版本的wiki和自述。

一些更改可以独立于jqGrid的版本使用:

• 如果使用datatype: 'json'，应删除data : API_URL。
• contentType是jQuery.ajax的选项。如果你需要在jqGrid中设置它，你应该使用ajaxGridOptions: {contentType: "application/json; charset=UTF-8"}。
• 如果你使用旧版本的jqGrid，那么你需要在jsonReader: {repeatitems: false, root: function (obj) { return obj; }}的形式中添加jsonReader。如果你使用free jqGrid，那么它会自动检测你当前JSON响应的结构，而不需要jsonReader。
• 如果你计划不实现服务器端分页和数据排序，你应该添加loadonce: true选项。您应该返回所有数据和一次，jqGrid将在客户端进行排序，分页和过滤。
• 如果你使用旧版本的jqGrid，你应该添加gridview: true来提高性能。Free jqGrid使用默认选项
• 我建议你使用height: "auto"而不是height: 200，但最好的选择取决于你的确切需求。
• 如果从服务器返回的数据是纯数据而不是单元格的HTML片段，则应该添加autoencode: true选项。
• 我建议你从colModel和默认值(edittype: 'text')中删除不需要的index属性。
• 您应该将key: true属性添加到TaskID列。输入数据必须包含rowid的信息。特别是为了能够编辑数据，你应该使用正确的行值。
• 如果你使用免费jqGrid，那么你可以删除<div id="pagernav"></div>，并用pager: true选项替换pager: '#pagernav'。Free jqGrid可以自动为分页创建所需的<div>。

UPDATED:服务器代码可以修改如下，例如:

using System.Collections.Generic;
using System.Web.Http;
namespace WebApiOne.Controllers
{
    public class Task
    {
        public int TaskID { get; set; }
        public int ProjectID { get; set; }
        public string ProjectName { get; set; }
        public string TaskName { get; set; }
        public string TaskStatus { get; set; }
    }
    public class TaskController : ApiController
    {
        // GET api/task
        public IEnumerable<Task> Get() {
            Task[] tasks = {
                new Task {
                    TaskID = 1,
                    ProjectID = 1,
                    ProjectName = "ProjectOne",
                    TaskName = "FirstPage Development",
                    TaskStatus = "InProgress"
                },
                new Task {
                    TaskID = 2,
                    ProjectID = 1,
                    ProjectName = "ProjectOne",
                    TaskName = "Second Page Development",
                    TaskStatus = "Yet To Start"
                }
            };
            return tasks;
        }
        // GET api/task/5
        public string Get(int id)
        {
            return "value";
        }
        // POST api/task
        public void Post ([FromBody]Task task)
        {
            //perform new Row Add to DB
            // task.TaskID will be 0 here
        }
        // PUT api/task/5
        public void Put (int id, [FromBody]Task task)
        {
            //perform Db Update
            // task.TaskID and id are identical
        }
        // DELETE api/task/5
        public void Delete (int id)
        {
            // Delete row in DB.
        }
    }
}

客户端代码可以是

$(document).ready(function() {
    "use strict";
    var apiUrl = "/WebApiOne/api/task/";
    jQuery("#gridMain").jqGrid({
        url: apiUrl,
        editurl: apiUrl,
        datatype: "json",
        gridview: true,
        height: "auto",
        iconSet: "fontAwesome",
        autoencode: true,
        sortable: true,
        viewrecords: true,
        loadonce: true,
        prmNames: { id: "TaskID" },
        colNames: ["TaskID", "ProjectID", "ProjectName", "TaskName", "TaskStatus"],
        colModel: [
            { name: "TaskID", width: 60, key: true, editable: false, sorttype: "int" },
            { name: "ProjectID", width: 90 },
            { name: "ProjectName", width: 190 },
            { name: "TaskName", width: 170, align: "right" },
            { name: "TaskStatus", width: 170, align: "right" }
        ],
        cmTemplate: { editable: true },
        //autowidth: true,
        formEditing: {
            width: 400,
            reloadGridOptions: { fromServer: true },
            serializeEditData: function (postdata) {
                var copyOfPostdata = $.extend({}, postdata);
                if (postdata.TaskID === "_empty") { // ADD operation
                    postdata.TaskID = 0; // to be easy to deserialize
                }
                delete copyOfPostdata.oper; // remove unneeded oper parameter
                return copyOfPostdata;
            }
        },
        formDeleting: {
            mtype: "DELETE",
            reloadGridOptions: { fromServer: true },
            serializeDelData: function () {
                return ""; // don't send and body for the HTTP DELETE
            },
            onclickSubmit: function (options, postdata) {
                //var p = $(this).jqGrid("getGridParam"); // get reference to internal parameters
                //p.datatype = "json";
                options.url = apiUrl + encodeURIComponent(postdata[0]);
            }
        },
        pager: true
    }).jqGrid("navGrid", {}, {
        mtype: "PUT",
        onclickSubmit: function (options, postdata) {
            //var p = $(this).jqGrid("getGridParam"); // get reference to internal parameters
            //p.datatype = "json"; // reset datatype to reload from the server
            options.url = apiUrl + encodeURIComponent(postdata[this.id + "_id"]);
        }
    }).jqGrid("filterToolbar") // add searching toolbar for local sorting (bacsue of loadonce:true) in the grid
        .jqGrid("gridResize");
});

上面的代码使用免费的jqGrid和字体Awesome。相应的演示项目可以从这里加载。您应该在服务器代码中设置断点，并使用Fiddler查看所有请求是否按预期工作。服务器代码应实现对数据库的删除/编辑/添加。重要的是要理解演示是基于原始代码的，它不会修改数据库中的任何数据。编辑后，将从服务器重新加载数据，以确保使用Add后分配的最后一个数据和服务器端id。由于数据不会保存在数据库中，也不会在服务器上修改，因此数据在加载后将在网格中原原本本地显示。这意味着需要扩展服务器代码以支持数据修改。我只是想展示如何配置客户端部分 (jqGrid)以向服务器发送正确的请求。

jsonReader : {
   repeatitems: false
},