使用免费的 jqGrid 4.15，无法过滤错误的复选框

Question

我正在使用免费的 jqGrid 4.15.0，我有三个复选框列，其中填充了三个布尔值。使用过滤器工具栏，"All" 选项有效，"True" 选项有效，但 "False" 选项从不匹配任何内容。我尝试将布尔值转换为整数 (0, 1) 并相应地设置搜索选项，但是直到我将 bools/ints 转换为字符串 ("true"、"false") 并在字符串上进行过滤之前，我永远无法使过滤器中的 "False" 选项起作用。

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

此屏幕使用先前版本的 jqGrid (4.5.2) 运行良好。

有人知道问题出在哪里吗？如果您还有其他需要查看的内容，请告诉我。

我的 class JSON 已交付给电网：

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; }
}

网格：

$('#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' });

View of checkboxes

Answer 1

如果我正确理解问题，那么你应该添加

sorttype: "boolean"

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

或者您可以考虑更改

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

至

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

使用 stype: "checkbox" 而不是 stype: "select"。您可以使用列声明的简短形式：template: "booleanCheckbox"。它允许从

简化列 Shipped 和 ExportFlag 的定义

{
    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: 'Shipped', label: $('#ShippedHeaderText').text(), width: 80, 
    template: "booleanCheckbox"
},
{
    name: 'ExportFlag', label: $('#ExportFlagHeaderText').text(), width: 80,
    template: "booleanCheckbox"
}

我个人主要是将 firstsortorder: "desc" 属性添加到 template: "booleanCheckbox" 以在第一次单击由 stype: "checkbox" 创建的树状状态复选框时搜索 true .

使用免费的 jqGrid 4.15，无法过滤错误的复选框

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

javascript

checkbox

jqgrid

free-jqgrid