关于javascript：使用免费的jqGrid 4.15，无法过滤false复选框

Using Free jqGrid 4.15, can't filter checkboxes on false

我正在使用Free jqGrid 4.15.0，我有三个复选框列，其中填充了三个布尔值。使用过滤器工具栏，"全部"选项有效，"真"选项有效，但"假"选项从不匹配任何内容。我尝试将布尔值转换为整数(0，1)并相应地设置searchoptions，但是直到将布尔值/整数转换为字符串(" true"，" false")并在字符串上进行过滤，我再也无法获得" False""在过滤器中进行选择。

复选框成功填充，只是过滤不起作用。

使用先前版本的jqGrid(4.5.2)，此屏幕可以正常工作。

有人知道这个问题是什么吗？让我知道您是否还有其他需要查看的内容。

我的类是JSON并传递到网格的：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

public class DelForDetails
{
public long ScheduleId { get; set; }
public DateTime? ShipmentDate { get; set; }
public string PurchaseOrderNumber { get; set; }
public string ProductNumber { get; set; }
public string ScheduleIdentifier { get; set; }
public Decimal? ShipmentQuantity { get; set; }
public string CommitmentLevel { get; set; }
public string ConsumerName { get; set; }
public string ShipToFacilityNumber { get; set; }
public bool Shipped { get; set; }
public bool ExportFlag { get; set; }
public bool MissingDateFlag { get; set; }
public string StatusForSchedule { get; set; }
}

网格：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68

$('#scheduleGrid').jqGrid({
url: url,
datatype: 'json',
mtype: 'GET',
colModel: [
{ name: 'ScheduleId', label: $('#ScheduleIdHeaderText').text(), width: 100, hidden: true, editable: true },
{
name: 'ShipmentDate', label: $('#ShipmentDate').text(), width: 100, align: 'center', editable: true,
formatter: stdDateFormatter, stype: 'text'
},
{ name: 'PurchaseOrderNumber', label: $('#PurchaseOrderNumber').text(), width: 150, align: 'left', editable: true },
{ name: 'ProductNumber', label: $('#ProductNumber').text(), width: 100, align: 'left', editable: false },
{ name: 'ScheduleIdentifier', label: $('#ScheduleIdentifierHeaderText').text(), width: 150, align: 'right', hidden: false },
{
name: 'ShipmentQuantity', label: $('#ShipmentQuantity').text(), width: 80, align: 'center', hidden: false, formatter: 'number',
formatoptions: { decimalPlaces: 4, thousandsSeparator: '' }
},
{ name: 'CommitmentLevel', label: $('#CommittmentLevelHeaderText').text(), width: 80, align: 'left', hidden: false },
{ name: 'ConsumerName', label: $('#CustomerName').text(), width: 150, align: 'left', hidden: false },
{ name: 'ShipToFacilityNumber', label: $('#ShipToCode').text(), width: 100, align: 'center', hidden: false },
{
name: 'Shipped', label: $('#ShippedHeaderText').text(), width: 80, align: 'center', hidden: false, formatter: 'checkbox',
stype: 'select', searchoptions: { sopt: ['eq', 'ne'], value: ':All;true:True;false:False' }
},
{
name: 'ExportFlag', label: $('#ExportFlagHeaderText').text(), width: 80, align: 'center', hidden: false, formatter: 'checkbox',
stype: 'select', searchoptions: { sopt: ['eq', 'ne'], value: ':All;true:True;false:False' }
},
{
name: 'MissingDateFlag', label: $('#MissingDateFlagHeaderText').text(), width: 80, align: 'center', hidden: false, formatter: 'checkbox',
stype: 'select', searchoptions: { sopt: ['eq', 'ne'], value: ':All;true:True;false:False' }
}
],
jsonReader: {
repeatitems: false,
id: 'ScheduleId'
},
pager: '#schedulePager',
altRows: true,
altclass: 'harmony-schedule-grid-altrow-class',
ignoreCase: true,
multiselect: true,
cellEdit: false,
rowNum: 15,
rowList: [15, 30, 50],
loadonce: true,
loadui: 'disable',
sortable: true,
sortname: 'ShipmentDate',
sortorder: 'asc',
viewrecords: true,
gridview: true,
autoencode: true,
height: 'auto',
autowidth: true,
subGrid: true,
loadComplete: function () {
$('#LoadingPanel').hide();
$('td[aria-describedby="scheduleGrid_subgrid"]').addClass('harmony-schedule-background-color');
$('td[aria-describedby="scheduleGrid_cb"]').addClass('harmony-schedule-background-color');
},
subGridRowExpanded: function (subgrid_id, row_id) {
...
}
})
.navGrid('#schedulePager', { del: false, add: false, edit: false, search: false })
.navButtonAdd('#schedulePager', { } })
.filterToolbar({ stringResult: true, searchOnEnter: false, autosearchDelay: 1000, defaultSearch: 'cn' });

复选框的视图

如果我正确理解了问题，则应该添加

1	sorttype:"boolean"

列中的

属性，应将这些数据解释为布尔值。它应该可以解决您的问题。

或者，您可以考虑更改

1
2
3
4
5

stype: 'select',
searchoptions: {
sopt: ['eq', 'ne'],
value: ':All;true:True;false:False'
}

到

1
2
3
4
5
6

sorttype:"boolean",
stype:"checkbox",
searchoptions: {
sopt: ["eq"],
value:"true:false"
}

使用stype:"checkbox"代替stype:"select"。您可以使用列声明的简短形式：template:"booleanCheckbox"。它允许简化来自

的列Shipped和ExportFlag的定义

1
2
3
4
5
6
7
8

{
name: 'Shipped', label: $('#ShippedHeaderText').text(), width: 80, align: 'center', hidden: false, formatter: 'checkbox',
stype: 'select', searchoptions: { sopt: ['eq', 'ne'], value: ':All;true:True;false:False' }
},
{
name: 'ExportFlag', label: $('#ExportFlagHeaderText').text(), width: 80, align: 'center', hidden: false, formatter: 'checkbox',
stype: 'select', searchoptions: { sopt: ['eq', 'ne'], value: ':All;true:True;false:False' }
}

到

1
2
3
4
5
6
7
8

{
name: 'Shipped', label: $('#ShippedHeaderText').text(), width: 80,
template:"booleanCheckbox"
},
{
name: 'ExportFlag', label: $('#ExportFlagHeaderText').text(), width: 80,
template:"booleanCheckbox"
}

我个人大多将firstsortorder:"desc"属性添加到template:"booleanCheckbox"，以便在第一次单击由stype:"checkbox"创建的树状复选框时搜索true。