Forums Ignite UI for jQuery
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Kenneth Haynes
255
igGrid ui.igGridFiltering appears broken in 19.1
posted

I'm getting an error: Uncaught TypeError: Cannot read property 'getEditor' of undefined after defining an igGrid filtering section. 

Here's my igGrid definition:

       $("#mainScreenGrid").igGrid({
            autoGenerateColumns: false,
            scrolling: true,
            renderCheckboxes: true,
            dataSource: data,
            dataSourceType: 'json',
            width: "100%",
            primaryKey: "oid",
            columns: [
                {
                    headerText: "Details",
                    key: "oid",
                    template: "<input type=\"button\" value=\"select\" onclick=\"return GetDetails('${oid}','${stTransactionSetIdCode}')\"/>",
                    width: "75px"
                },
                {
                    headerText: "Inbound",
                    key: "isInbound",
                    dataType: "bool",
                    width: "50px"
                },
                {
                    headerText: "Sender",
                    key: "isaSenderId",
                    dataType: "string",
                    width: "100px"
                },
                {
                    headerText: "Receiver",
                    key: "isaReceiverId",
                    dataType: "string",
                    width: "100px"
                },
                {
                    headerText: "Date Time",
                    key: "isaDateTime",
                    dataType: "date",
                    width: "100px"
                },
                {
                    headerText: "Version",
                    key: "isaControlVersionNumber",
                    dataType: "string",
                    width: "75px"
                },
                {
                    headerText: "ISA Control Number",
                    key: "isaControlNumber",
                    dataType: "string",
                    width: "150px"
                },
                {
                    headerText: "Group Control Number",
                    key: "gsGroupControlNum",
                    dataType: "string",
                    width: "150px"
                },
                {
                    headerText: "Document Type",
                    key: "stTransactionSetIdCode",
                    dataType: "string",
                    width: "150px"
                },
                {
                    headerText: "Has Errors",
                    key: "hasErrors",
                    dataType: "bool",
                    width: "50px"
                }
            ],
            features: [
                {
                    name: 'Sorting',
                    type: 'local'
                },
                {
                    name: 'Resizing',
                    allowDoubleClickToResize: true
                },
                {
                    name: "Paging",
                    type: "local",
                    pageSize: 50
                },
                {
                    name: 'Filtering',
                    type: 'local',
                    mode: 'simple',
                    allowFiltering: true,
                    caseSensitive: false,
                    columnSettings: [
                        { columnKey: 'oid', allowFiltering: true },
                        { columnKey: 'isInbound', allowFiltering: true },
                        { columnKey: 'isaSenderId', allowFiltering: true },
                        { columnKey: 'isaReceiverId', allowFiltering: true },
                        { columnKey: 'isaDateTime', allowFiltering: true },
                        { columnKey: 'isaControlVersionNumber', allowFiltering: true },
                        { columnKey: 'isaControlNumber', allowFiltering: true },
                        { columnKey: 'gsGroupControlNum', allowFiltering: true },
                        { columnKey: 'stTransactionSetIdCode', allowFiltering: true },
                        { columnKey: 'hasErrors', allowFiltering: true }
                    ]
                }
            ] // End of features array
        });

If I comment out the section on filtering in the features area, the grid will come up and present the data from the AJAX call.  If I leave the filtering section in, I get the the error message: "Uncaught TypeError: Cannot read property 'getEditor' of undefined". It's coming from infragistics.log.js on line 244.  

I tried using jquery version 3.3.0, and got the error. I then read in the infragistics.lob.js file that it depends on jquery-1.9.1.js so I tried that version and still got the error. 

From the call stack it looks like it's trying to set the width. 

  • 3995
    Verified Answer
    Offline posted

    Hello,

    I tried reproducing the error on this fiddle and didn't manage to do so. The first that comes to my mind is to make sure the references are correct.

    If I'm missing something out, can you please modify the fiddle and send a link back for further investigation.

  • 255
    Offline posted

    It's in this section of code:

                _setEditorsWidth: function() {
                if (this.options.mode !== "simple" && this.options.advancedModeEditorsVisible !== true) {
                    return
                }
                var cs = this.options.columnSettings, cols = this.grid._visibleColumns(), cells = this.grid.headersTable().find("thead tr[data-role=filterrow]").first().find("td").not("[data-skip=true]"), cellWidth, i, j, skipColumn, editorProvider;
                for (i = 0; i < cols.length; i++) {
                    for (j = 0; j < cs.length; j++) {
                        if (cs[j].columnKey === cols[i].key && cs[j].allowFiltering === false) {
                            skipColumn = true;
                            break
                        }
                    }
                    if (skipColumn) {
                        skipColumn = false;
                        continue
                    }
                    if (!$.ig.util.isOpera && (this.grid.options.height && this.grid.options.fixedHeaders === true || $.ig.util.isWebKit)) {
                        cellWidth = cells.eq(i).innerWidth()
                    } else {
                        cellWidth = cells.eq(i).width()
                    }
                    cellWidth -= cells.eq(i).data("buttonWidth");
                    editorProvider = cells.eq(i).find("span[data-filter-editor]").first().data("provider");
                    if (!editorProvider) {
                        editorProvider = this._editorProviders[i]
                    }
                    if (editorProvider.getEditor()) {
                        this._setEditorOption(editorProvider.getEditor(), "width", cellWidth);
                        this._setEditorInputWidth(editorProvider)
                    }
                }
            },

    It appears that editorProvider in if(editorProvider.getEditor) on line 27 is undefined.

  • 255
    Offline posted

    Could this be the problem?

     

                        if (editorProvider.getEditor) {
                        this._setEditorOption(editorProvider.getEditor(), "width", cellWidth);
                        this._setEditorInputWidth(editorProvider)
                    }

    if(editorProvider.getEditor) should be if(editorProvider.getEditor()). 

    It's being called as a property, not as a method and blowing up.