Free jqGrid - A custom filter rule for “empty” and “not empty” [closed]

Question

I'm familiar with the custom operations that can bd added to the dropdown selection on the left next to each column filter.

What i'm after, is to add two new types of custom operators for filtering: 1. Empty 2. Not empty

While I know how to achieve that per se, I have a problem with the UX of such flow within Free JqGrid. This is because these two custom operators don't need any input from the user once they were chosen, so the user will have to click 'enter' after choosing this operator with an empty value - very confusing.

What I want to know is how to achive the following consider I already defined a new custom operator:

1. Make the transaction go once I choose this operator, without waiting for the user to type anything, or click enter (something like onSelect).
2. Optionally, disable the ability to type anything within that specific filter once that specific operator was selected.

Thanks,

Tal.

Answer 1

Thanks for pointing of the problem of definition custom unary operations. I committed the changes of the code of free jqGrid to allow to specify the custom unary operations inside of new option customUnaryOperations.

The demo defines two custom filtering operations: "em" ("is empty") and "nm" ("isn't empty") and use the operations in "Amount" and "Notes" columns. The column "Notes" uses additionally the standard (predefined) "nu" ("is null") and "nn" ("is not null") operations. The column "amount" uses

searchoptions: {sopt: ["eq", "ne", "em", "nm"]}

and the column "note" uses

searchoptions: {sopt: ["cn", "bw", "ew", "eq", "bn", "nc", "en", "nu", "nn", "em", "nm"]}

additionally the demo uses customSortOperations and new customUnaryOperations:

customUnaryOperations: ["em", "nm"],
customSortOperations: {
    em: {
        operand: "=''",
        text: "is empty",
        filter: function (options) {
            var v = options.item[options.cmName];
            if (v === undefined || v === "") {
                return true;
            }
        }
    },
    nm: {
        operand: "!=''",
        text: "isn't empty",
        filter: function (options) {
            var v = options.item[options.cmName];
            if (v !== undefined && v !== "") {
                return true;
            }
        }
    }
}