Question

我仍然开始学习jquery和JavaScript。我正在尝试使用jqGrid显示项目。我完全听不懂。希望您能对我有所帮助，并希望宝贝能逐步解释为什么它不起作用。这是我的代码。我还使用.NetCore 1.0。我的目标是将项目显示在桌子上。它仅添加空白行和行数。但没有项目详细信息。

Click here for image of the form

jqGrid

//Load Table
function LoadTable(param) {
  //Loading(true);
  $("#tblItem").jqGrid("GridUnload");
  $("#tblItem").jqGrid("GridDestroy");
  $("#tblItem")
    .jqGrid({
      url: window.getItemListURL,
      postData: param,
      autowidth: true,
      datatype: "json",
      mtype: "POST",
      colNames: [
        "",
        "",
        "",
        "PLU",
        "Category",
        "Display Name",
        "Description",
        "Unit Cost",
        "UOM",
        "Mark-Up",
        "Good For",
        "Selling Price",
        "Is Taxable",
      ],
      colModel: [
        { name: "edit", index: "edit", width: 20, align: "center", sortable: false },
        { name: "delete", index: "delete", width: 20, align: "center", sortable: false },
        {
          key: true,
          hidden: true,
          name: "Id",
          index: "Id",
          editable: false,
          edittype: "checkbox",
          editoptions: { value: { false: "No", true: "Yes" } },
        },
        { key: false, name: "PLU", index: "1", width: 150, editable: true, align: "left", sortable: true },
        { key: false, name: "CategoryID", index: "2", editable: false, width: 150, align: "left", sortable: true },
        { key: false, name: "DisplayName", index: "3", width: 150, editable: false, align: "left", sortable: true },
        { key: false, name: "Description", index: "4", width: 150, editable: false, align: "left", sortable: true },
        { key: false, name: "UnitCost", index: "16", width: 150, editable: false, align: "left", sortable: true },
        { key: false, name: "UOM", index: "15", editable: false, align: "left", sortable: true },
        { key: false, name: "MarkUp", index: "5", editable: false, align: "left", sortable: true },
        { key: false, name: "GoodFor", index: "6", editable: false, width: 150, align: "left", sortable: true },
        { key: false, name: "SellingPrice", index: "7", editable: false, align: "left", sortable: true },
        { key: false, name: "IsTaxable", index: "8", editable: false, align: "left", sortable: true },
      ],
      pager: $("#divPager"),
      rowNum: 10,
      rowList: [10, 20, 30, 40],
      loadonce: false,
      viewrecords: true,
      jsonReader: {
        root: "rows",
        page: "page",
        total: "total",
        records: "records",
        repeatitems: false,
      },
      emptyrecords: "No records to display",
      rowNumbers: true,
      sortorder: "desc",
      width: "100%",
      height: "100%",
      sortable: true,
      onPaging: function(pgButton) {},
      loadComplete: function() {},
      loadError: function(xhr, status, error) {
        var msg = "";
        if (xhr.responseJSON !== undefined) {
          if (xhr.responseJSON.IsListResult) {
            for (var i = 0; i < xhr.responseJSON.Result.length; i++) {
              msg += xhr.responseJSON.Result[i] + "<br />";
            }
          } else {
            msg += xhr.responseJSON.Result;
          }
        } else {
          msg = $(xhr.responseText)
            .filter("title")
            .text();
        }
        alert(msg);

        //Loading(false);
      },
    })
    .navGrid("#divPager", { edit: false, add: false, del: false, search: false, refresh: false });
}

CSHTML代码

    <head>
    <title>Maintenance</title>
</head>
<body>
    <div class="row">
        <div class="col-md-12">
            <div id="Create" class="col-md-12 form-group text-center mt-3">
                <a asp-action="CreateItem">Create Item</a>
            </div>
            <div class="col-md-12 form-group text-center mt-3">
                <a asp-action="ViewItem">View Item</a>
            </div>
        </div>
    </div>
    @* --- SEARCH AREA --- *@
    <div class="col-md-12">
        <input type="text" class="col-md-2" name="search" placeholder="Search.." />
        <button id="btnSearch">S</button>
        <button id="btnRefresh">R</button>
        <button id="btnAdd">Add</button>
        <button id="btnDeleteAll">X</button>
    </div>

    @* ----- TABLE ----- *@
    <div class="col-md-12">
        <div class="mt-12 mb-5">
            <table id="tblItem" class="scroll" cellpadding="0" cellspacing="0"></table>
            <div id="divPager" class="scroll" style="text-align:center;"></div>
        </div>
    </div>
</body>

控制器

[HttpPost]
public JsonResult ViewAllItem()
{
    System.Collections.Generic.IEnumerable<ENTITIES.ENT_Items> ent_Items;
    ViewModels.ViewModel_ItemMaintenance vm_ItemMaintenance = new ViewModels.ViewModel_ItemMaintenance();
    using (Models.H2POSContext db = new Models.H2POSContext(_options))
    {
        ent_Items = db.t_Items.ToList();

    }

    var jsonData = new
    {
        rows = ent_Items.ToArray(),
        page = 1,
        total = 1,
        records = 1,
        sort = ""
    };
    return Json(jsonData);
}

更新我刚刚发现jqgrid没有收到任何数据。从控制器那里有一个数据，但是当它被传送到jqgrid时它是空白的。有人知道我如何开始发现问题吗？

jqGrid不会显示，仅显示计数

0 个答案: