Author Topic: GroupModel range filter errors when setting a group column filter to null  (Read 553 times)

CharlestonGeek

  • Pro Ultimate
  • Newbie
  • *
  • Posts: 8
  • Christopher Hutner
    • View Profile
I understand why the grouped column can't be filtered by null.

I am looking for documentation on how to prevent the range filter on a grouped column from allowing a null selection in the first place.

Something like:
Code: [Select]
minCheck = 1;
OR when null keep the range selection open until something is selected

On the attached image, Year is grouped. If you attempt to filter to 1 year, you might click deselect all. Which results in null and the following error.

Here is the error.
Quote
Uncaught TypeError: Cannot read properties of undefined (reading 'refresh')
    at $.refresh (pqgrid.min.js:9:58950)
    at a.paramquery.cCheckBoxColumn.checkNodes (pqgrid.min.js:9:115422)
    at a.paramquery.cCheckBoxColumn.checkAll (pqgrid.min.js:9:114803)
    at a.paramquery.cCheckBoxColumn.onHeaderChange (pqgrid.min.js:9:8598)
    at HTMLInputElement.<anonymous> (pqgrid.min.js:9:9121)
    at HTMLInputElement.dispatch (3.6.1.min.js:2:43064)
    at y.handle (3.6.1.min.js:2:41048)
$.refresh @ pqgrid.min.js:9
checkNodes @ pqgrid.min.js:9
checkAll @ pqgrid.min.js:9
onHeaderChange @ pqgrid.min.js:9
(anonymous) @ pqgrid.min.js:9
dispatch @ 3.6.1.min.js:2
y.handle @ 3.6.1.min.js:2
Show 5 more frames

Running jQuery 3.6.1, jQuery UI 1.13.2 and pq 8.6.0
« Last Edit: October 20, 2022, 12:37:48 am by CharlestonGeek »

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6255
    • View Profile
Range filter allows deselect all in a grouped column without any error.

Please check ShipCountry and Customer Name columns in this example: https://paramquery.com/pro/demos/group_rows

CharlestonGeek

  • Pro Ultimate
  • Newbie
  • *
  • Posts: 8
  • Christopher Hutner
    • View Profile
When you add the filter range to the column it DOES NOT work. Only in the menuIcon.

https://paramquery.com/pro/demos/export

Code: [Select]
    $(function () {
        var colM = [
            { title: "ShipCountry", width: 120, dataIndx: "ShipCountry", filter: { crules: [{ condition: 'range' }], gridOptions: { numberCell: {show: false} } } },
            { title: "Customer Name", width: 130, dataIndx: "ContactName", filter: { crules: [{ condition: 'range' }], gridOptions: { numberCell: {show: false} } } },
            { title: "Freight", width: 120, format: '$##,###.00',
                summary: {
                    type: "sum"
                },
                dataType: "float", dataIndx: "Freight", filter: { crules: [{ condition: 'range' }], gridOptions: { numberCell: {show: false} } }
            },
            { title: "Shipping Via", width: 130, dataIndx: "ShipVia", filter: { crules: [{ condition: 'range' }], gridOptions: { numberCell: {show: false} } } },
    { title: "Shipped Date", width: 100, dataIndx: "ShippedDate", dataType: "date", format: 'yy-mm-dd', filter: { crules: [{ condition: 'range' }], gridOptions: { numberCell: {show: false} } } },
            //{ title: "Shipping Address", width: 220, dataIndx: "ShipAddress" },
            { title: "Shipping City", width: 130, dataIndx: "ShipCity", filter: { crules: [{ condition: 'range' }], gridOptions: { numberCell: {show: false} } } }
];
        var dataModel = {
            location: "remote",
            dataType: "JSON",
            method: "GET",
            url: "/Content/orders.json"
            //url: "/pro/orders/get",//for ASP.NET
            //url: "orders.php",//for PHP
        };
        var groupModel = {
            on: true,
            dataIndx: ['ShipCountry'],
            collapsed: [false],
            title: [
                "{0} ({1})",
                "{0} - {1}"
            ]
        };
        var obj = {
            height: 500,
            toolbar: {
                items: [{
                    type: 'checkbox',
                    label: 'zip',
                    attr: 'id="export_zip"'
                },
                {
                    type: 'select',
                    label: 'Format: ',               
                    attr: 'id="export_format"',
                    options: [{ xlsx: 'Excel', csv: 'Csv', htm: 'Html', json: 'Json'}]
                },
                {
                    type: 'button',
                    label: "Export",
                    icon: 'ui-icon-arrowthickstop-1-s',
                    listener: function () {
                        this.exportData({
                            url: "/pro/demos/exportData",
                            format: $("#export_format").val(),
                            zip: $("#export_zip").prop("checked"),
                            nopqdata: true, //applicable for JSON export.
                            render: true
                        });
                    }
                }]
            },
            dataModel: dataModel,
filterModel: { mode: "AND", header: true },
            scrollModel: { autoFit: true },
            colModel: colM,
            numberCell: { show: false },
            menuIcon: true,
            selectionModel: { type: 'cell' },
            groupModel: groupModel,           
            showTitle: false,
            resizable: true,           
            hwrap: false,
            wrap: false
        };
        var grid = pq.grid("#grid_export", obj);

    });


CharlestonGeek

  • Pro Ultimate
  • Newbie
  • *
  • Posts: 8
  • Christopher Hutner
    • View Profile
Any confirmation or help?

The filter header range option/selecting is broken when rows are grouped.

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6255
    • View Profile
I'm able to reproduce the error, moving it to bug report for further analysis, thanks for pointing out the issue.