Adding a new operator in the search dialog

Question

As filter operator you can choose from among: 'equal','not equal', 'less', 'less or equal','greater','greater or equal', 'begins with','does not begin with','is in','is not in','ends with','does not end with','contains' and 'does not contain'. I'd like to add an extra operator to this list. Can somebody point me in the right direction to achieve this?

The application is filtering using the dialog, and we are currently (very happily!) using free-jqgrid 4.15.0.

In case you wonder about the use case: our application has a date field and a very common filter is to filter records "due within X days from now". For best usability we don't like that users have to change the date filter every day.

score 0 · Accepted Answer · answered Mar 29 '19 at 20:09

Free jqGrid allows to define custom searching/filtering operation with respect of customSortOperations option. By default the corresponding custom compare operation will have two operands. Unary operations should be specified in customUnaryOperations option additionally. The feature is initially described in the wiki article. One can find some examples of usage the feature on the stackoverflow.

The custom compare/filter operators defined in customSortOperations need be included in the definition of the corresponding column in the array searchoptions.sopt. The demo uses the following code:

colModel: [
    ...
    { name: "name", align: "justify", width: 87, editrules: { required: true },
      autoResizing: { minColWidth: 87 },
      createColumnIndex: true,
      searchoptions: {
        generateDatalist: true,
        sopt: [ "cn", "em", "nm", "in", "ni",
            "teq", "tne",
            "eq", "bw", "ew", "bn", "nc", "en" ],
        clearSearch: true
      } },
    ...
],
customUnaryOperations: ["em", "nm"],
customSortOperations: {
    em: {
      operand: "=''",
      text: "is empty",
      filter: function (options) {
        var v = options.item[options.cmName];
        if (v === undefined || v === null || v === "") {
          return true;
        }
      }
    },
    nm: {
      operand: "!=''",
      text: "isn't empty",
      filter: function (options) {
        var v = options.item[options.cmName];
        if (v !== undefined && v !== null && v !== "") {
          return true;
        }
      }
    },
    teq: {
        operand: "==",
        text: "Turkish insensitive \"equal\"",
        filter: function (options) {
            var fieldData = String(options.item[options.cmName]).replace(/i/g,'İ').toUpperCase(),
                searchValue = options.searchValue.replace(/i/g,'İ').toUpperCase();
            return fieldData === searchValue;
        }
    },
    tne: {
        operand: "!=",
        text: "Turkish insensitive \"not equal\"",
        filter: function (options) {
            var fieldData = String(options.item[options.cmName]).replace(/i/g,'İ').toUpperCase(),
                searchValue = options.searchValue.replace(/i/g,'İ').toUpperCase();
            return fieldData !== searchValue;
        }
    }
},

The code defines 4 custom operations: "em", "nm", "teq", "tne", where "em" ("is empty") and "nm" ("isn't empty") are unary operations. I get the code from my old answers: this one and another one.

The custom operations are available in searching toolbar and in the searching dialog:

I think it's the feature, which you need. I'd recommend you additionally to read another answer, which is close to your requirements. I think that simple modification of the code could solve your problem.

Adding a new operator in the search dialog

1 Answers1

Linked