【发布时间】：2019-05-17 20:08:56
【问题描述】：
我希望输入过滤器字段按预期创建并显示在标题行单元格下。
在我的 MVC 解决方案中，我的 JSGrid 通过 AJAX/JSON/GET 填充。我能够对 loadData javascript 等进行排序并单步执行。当我添加“filtering:true”时，会在标题行和表体行之间生成一个带有单元格的行，但输入字段不存在。我尝试过包含不同的 CSS、JQuery 和 JS 库，并尝试模仿许多演示和示例..
function RenderImportHistory() {
$("#jsGrid_ImportHistory").jsGrid({
width: "100%",
height: "572px",
pageSize: 10,
pageButtonCount: 5,
filtering: true,
editing: true,
sorting: true,
paging: true,
autoload: true,
loadIndication: true,
loadIndicationDelay: 500,
loadMessage: "Getting Import History ...",
controller: {
loadData: function (filter) {
var d = $.Deferred();
$.ajax({
url: "@Url.Action("GetImportHistory", "SCAL", new { Area = "Admin" })",
dataType: "json",
type: "GET"
}).done(function(result) {
/*result = $.grep(result, function(item) {
return item.patientId === filter.patientId
&& item.patientName === filter.patientName
&& item.genderId === filter.genderId
&& item.mobile === filter.mobile;
}); */
d.resolve(result);
});
return d.promise();
}
},
fields: [
{ name: "ID", type: "Number", css: "jsGrid_Body", headercss: "jsGrid_Head", width: 11, sorter:"number" },
{ name: "ImportSched_ID", type: "Number", title: "Schedule", css: "jsGrid_Body", headercss: "jsGrid_Head", width: 27, sorter:"number" },
{ name: "Created", type: "Text", title: "Started", css: "jsGrid_Body", headercss: "jsGrid_Head", itemTemplate: function (value) { return FormatDateTime(value); } },
{ name: "Completed", type: "Text", title: "Ended", css: "jsGrid_Body", headercss: "jsGrid_Head", itemTemplate: function (value) { return FormatDateTime(value); } },
{ name: "NumOfClaims", type: "Number", title: "Claims", css: "jsGrid_Body", headercss: "jsGrid_Head", width: 21, sorter: "number", itemTemplate: function (value) { return FormatCounts(value); } },
{ name: "NumOfRecords", type: "Number", title: "Rows", css: "jsGrid_Body", headercss: "jsGrid_Head", width: 21, sorter: "number", itemTemplate: function (value) { return FormatCounts(value); } },
{ name: "TimeToRead_Seconds", type: "Number", title: "Read", css: "jsGrid_Body", headercss: "jsGrid_Head", width: 21, sorter: "number", itemTemplate: function (value) { return FormatDuration(value); } },
{ name: "TimeToWrite_Seconds", type: "Number", title: "Wrote", css: "jsGrid_Body", headercss: "jsGrid_Head", width: 21, sorter: "number", itemTemplate: function (value) { return FormatDuration(value); } }
]
});
}
【问题讨论】：
-
你的 jsGrid_Head css 中是否碰巧有一些隐藏文本字段的东西，也许？旁注，您可以只返回 $.ajax 而不是 $.Deferred 额外步骤，只要您还删除了 .done。
-
查看生成的 HTML/CSS，TR 和 TD 存在于过滤器行/单元格中，但 TD 中没有任何内容。我取出所有与 JS Grid 相关的自定义 CSS 只是为了当然，但仍然没有。以下是它生成的内容：
.. 我在尝试不同的示例时弄乱了客户端过滤，此时我'我只是要手动定义一些字段来过滤网格上方。我认为它必须与包含的库版本等有关。他们的演示很简单，但他们使用了许多小的本地包含 我可能应该尝试完全按照演示的方式进行操作，并使用所有包含的 JS 和 CSS 库，而不是 1 个 CDN 托管库。接下来我将使用 JqGrid。我是在此之前真的很喜欢这个 JsGrid。最终我需要我的新雇主购买 Kendo UI :-)我已经在我的页面中尝试了你的代码来执行此操作，甚至将你的网格基本上剥离，它仍然没有显示过滤，所以到目前为止我很难过。是的，这很奇怪，看起来应该很简单，但是，没有骰子。感谢您的帮助并尝试运行它，有助于证明包含理论到.. thnx 再次..
标签： javascript jquery html css jsgrid