Running the example at datatables.net got errors

Running the example at datatables.net got errors

cpmfpgacpmfpga Posts: 3Questions: 1Answers: 0

I am new to datatable and now getting familiar with datatable by running examples.
When I run the example at "https://datatables.net/examples/api/multi_filter.html", I got an error message:

The third row of javascript code in this example:
this.api()
Error message: 'Property 'api' does not exist on type 'Config'. ts(2339)'

My running configurations are
"datatables.net": "^1.13.7",
"jquery": "^3.7.0",

Would you give me some suggestions to resolve this problem.
Thanks in advance.

This question has accepted answers - jump to:

Answers

  • allanallan Posts: 60,929Questions: 1Answers: 9,932 Site admin
    Answer ✓

    That's a Typescript error rather than a runtime error. I'll look into what is causing the issue there, but you could try: (this as any).api() which will workaround it.

    Allan

  • cpmfpgacpmfpga Posts: 3Questions: 1Answers: 0

    Thanks for your response. It really resolve the problem.

    But after adjusting some codes of this example:

        new DataTable('#example', {
          initComplete: function () {
              (this as any).api()
                  .columns()
                  .every( () => {
                      let column = this;
                      let title = (column as any).footer().textContent; ////
    
                       // Create input element
                      let input = document.createElement('input');
          . . .
    

    the debugger gave me an error:
    ERROR TypeError: column.footer is not a function
    at _Api.<anonymous> (app.component.ts:18:47)
    at _Api.<anonymous> (jquery.dataTables.mjs:9706:7)
    at _Api.iterator (jquery.dataTables.mjs:7201:16)
    at _Api.<anonymous> (jquery.dataTables.mjs:9695:15)
    at _Api.every (jquery.dataTables.mjs:7340:18)
    at jQuery.fn.init.initComplete (app.component.ts:16:16)
    at jquery.dataTables.mjs:6773:18
    at Function.map (jquery.js:506:13)
    at _fnCallbackFire (jquery.dataTables.mjs:6772:11)
    at _fnInitComplete (jquery.dataTables.mjs:4857:2)

    I have no idea how to handle it.
    Would you give me some help, thanks a lot.

  • allanallan Posts: 60,929Questions: 1Answers: 9,932 Site admin

    You've changed it to use an arrow function, which changes the scope of the function. Instead of this being set by the caller, it is now the same scope as the host function's.

    Use .every( function () { instead and it should work.

    Allan

  • cpmfpgacpmfpga Posts: 3Questions: 1Answers: 0

    Thanks again for your kindly reply.

    I change back the function notation as you said, '.every( function () {' ,and I get the error:

    . . .
                .every(function () {
                    let column = this;  ////
    . . .
    

    'this' implicitly has type 'any' because it does not have a type annotation.ts(2683) .

    Then, I find that there are some comments for this error on [here].(https://stackoverflow.com/questions/41944650/this-implicitly-has-type-any-because-it-does-not-have-a-type-annotation "here")

    Following these comments by changing to
    .every(function(this:any) {
    the problem is resolved.

    I think this approach is similar to the suggestion you gave in the first reply.

  • allanallan Posts: 60,929Questions: 1Answers: 9,932 Site admin
    Answer ✓

    Interesting. I guess you could do:

    let column = this as any;
    

    as well.

    Really though, what is needed is for me to fix the typing for those callbacks. I'll get that done!

    Allan

Sign In or Register to comment.