[Editor] - h is not a function

VascoSaavedra · July 2018

I'm having a strange error on editor 1.7.4): when losing the focus on an editable cell, i'm having the following error:

        Uncaught TypeError: h is not a function
            at Object.eval (eval at <anonymous> (jquery-1.12.4.js:349), <anonymous>:1826:26)
            at Function.each (jquery-1.12.4.js:376)
            at f._submitTable (eval at <anonymous> (jquery-1.12.4.js:349), <anonymous>:1824:7)
            at f._submit (eval at <anonymous> (jquery-1.12.4.js:349), <anonymous>:1807:134)
            at o (eval at <anonymous> (jquery-1.12.4.js:349), <anonymous>:1194:39)
            at f.submit (eval at <anonymous> (jquery-1.12.4.js:349), <anonymous>:1206:3)
            at HTMLTableElement.<anonymous> (datatables.min.js:355)
            at HTMLTableElement.fn (jquery-1.12.4.js:4825)
            at HTMLTableElement.dispatch (jquery-1.12.4.js:5226)
            at HTMLTableElement.elemData.handle (jquery-1.12.4.js:4878)

The error happens on line 1805, when executing the following code:

            !1 === this._event("preSubmit", [x, r]) ? this._processing(!1) : (this.s.ajax || this.s.ajaxUrl ? this._ajax : this._submitTable).call(this, x, function(c, d, f) {
                i._submitSuccess(c, d, x, t, i.s.action, h, e, a, b, f)
            }, function(a, c, e) {
                i._submitError(a, c, e, b, x, i.s.action)
            }, x)

The problem most certainly is not on datatables/editor, but probably in something in my end.
It could be a file missing, or loaded in an incorrect order, etc ...

Do you have any idea that could help me understanding the problem?

The debugger can be seen here: https://debug.datatables.net/irusep

allan · July 2018

Could you give me a link to a page showing the issue so I can debug it please? Also, can you show me your Javascript code for DataTables and Editor?

Allan

VascoSaavedra · July 2018

I'm sorry, the page is not acessible online.

This is the Datatables/Editor code:

editor = new $.fn.dataTable.Editor({
    table: "#table",
    fields: editorFields
});
 
 
datatable = $("#table").DataTable({
    ajax: {
        url: getUrl(),
        data: createBaseRequest(),
        type: "POST",
        datatype: "json",
        error: function(xhr, error, thrown) {
            const json = $.parseJSON(xhr.responseText);
            swal(json.Message, json.ExceptionMessage, "error");
        },
        dataSrc: ""
    },
    columns: datatableColumns,
    bPaginate: false,
    bFilter: false,
    bInfo: false,
    bSort: false,
    bSortable: false,
    scrollX: true,
    scrollY: "200px",
    scrollCollapse: true,
    keys: {
        editor: editor,
        editOnFocus: true
    },
    select: {
        style: 'single'
    }
});
 
// Select all row when on focus
datatable.on('key-focus', function(e, datatable, cell, originalEvent) {
    datatable.row(cell.index().row).select();
});
 
// Storing last KeyDown
datatable.on('keydown', function(e, datatable, cell, originalEvent) {
    focusKey = e.keyCode;
});
 
//check if we are on last column, if so, add new line
datatable.on('key-blur', function(e, d, cell) {
    const td = $(cell.node());
    const parent = td.parent('tr');
 
    if (parent.is(':last-child') && td.is(':last-child')) {
        if (focusKey === addNewLineKey) {
            addNewRowInternal(datatable);
        }
    }
});

allan · July 2018

Can you show me what editorFields and datatableColumns are please?

Also, can you give me the steps you take to cause the error to happen? Does it happen on load, on submit, on edit, etc?

Without being able to see the page there will probably be other information I need as well, such as the client / server data interchange, but that will depend on went the error is happening.

Allan

VascoSaavedra · July 2018

@allan, as i cannot post it on a public forum, i sent the full code by email.

The error happens only when editing.
When the user focus on an editable column, when the column loses the focus, the error happens.

allan · July 2018

I'm afraid I didn't get that e-mail. Could you send it again please? allan @ this domain .net.

Allan

VascoSaavedra · July 2018

I've just resend the email, thank you!

allan · July 2018

I'm sorry, but I still don't appear to have an e-mail from you. Could you send the information in a Private Message in the forum instead? Click my forum user name above and then the "send message" button.

Allan

VascoSaavedra · July 2018

@allan, reverting to 1.7.3 corrected the problem, so this seems related to version 1.7.3.

PS: Sent the file by PM.

allan · July 2018

Ah! I think I know what it is in that case. Have you also updated your DataTables install? Local table editing used an API method that was introduced in DataTables 1.10.18 to fix a bug in it.

Allan

VascoSaavedra · July 2018

I see, we are still using DataTables 1.10.16.

I assume i would need to have Datatables >= 1.10.18 in order to use Editor 1.7.4?

allan · July 2018

Yes please. It should be a drop in replacement.

Allan

VascoSaavedra · July 2018

I've updated Datatables to 1.10.18, and the initial problem is now solved.

Has anything changed regarding the way the Editor detects the changes?

The following code has a different behavior on 1.7.3 vs 1.7.4:

editor.field('field').input().on('change', function(e, d) { const newValue = $(this).val();

On 1.7.3 => this is only triggered after the user completed the input
On 1.7.4 => this is triggered as soon as the user types anything.

For example, if the user wants to type: "Test":
* On 1.7.3 => newValue = Test
* On 1.7.4 => newValue = T

VascoSaavedra · July 2018

I'm having another issue with 1.7.4.
Now, the Editor does not edit on focus, even though the property is defined as true:

                keys: {
                    editor: editorRef,
                    editOnFocus: true
                },

allan · July 2018

In this example your input event works as expected in 1.7.4 for me:

editor.field('first_name').input().on('change', function(e, d) {
  console.log( $(this).val() );
} );

Regarding KeyTable - did you also update KeyTable?

Allan

VascoSaavedra · July 2018

Yes, to 2.4.1 version.

Debugger shows the following information:

DataTables 1.10.18 A new version (1.10.19) is available.
Editor 1.7.4 Up-to-date
KeyTable 2.4.1 Up-to-date
Select 1.2.6 A new version (1.2.7) is available.

VascoSaavedra · July 2018

Debugger full info here: https://debug.datatables.net/omisok

allan · July 2018

You are correct - there appears to be a bug there - example.

I'm currently working on KeyTable 2.5 which will actually see a number of changes - double click to trigger immediate editing and single click to get the current behaviour. The editOnFocus option won't be used any more.

Discussion about the new features available here.

Allan

VascoSaavedra · July 2018

Allan, thank you very much for your quick reply.

Could you please provide an estimate on when KeyTable 2.5 will be released?

VascoSaavedra · July 2018

If i'm interpreting it correctly, will the Edition only be possible by clicking?

I'm asking because in our use case, the behavior provided by editOnFocus is very important.

Could you please clarify?

VascoSaavedra · July 2018

@allan, i'm sorry to insist, could you please clarify the above?

Thank you!

allan · July 2018

I don't currently have a time frame for the 2.5 release - I don't expect it to be too far away though.

I will attempt to fix editOnFocus for a 2.4.x patch release and post back with how I get on.

In 2.5 editOnFocus will be removed. You can go to immediate edit mode by double clicking, or typing after a single click.

Allan

allan · July 2018

I've committed a fix onto a 2.4 branch - which you can get here. That addresses the editOnFocus issue, and maintains the features you are used to from 2.4.

Allan

VascoSaavedra · July 2018

Thank you for the fix on 2.4.

Regarding editOnFocus, would it be possible to also go to edit mode if Enter is pressed?

allan · July 2018

In 2.5? Yes, it does that.

Allan

VascoSaavedra · July 2018

Thank you!

[Editor] - h is not a function

[Editor] - h is not a function

Answers

Howdy, Stranger!

Categories

DataTables

[Editor] - h is not a function

[Editor] - h is not a function

Answers

Howdy, Stranger!

Quick Links

Categories

DataTables