Cannot read property 'oApi' of undefined

Cannot read property 'oApi' of undefined

tengelstengels Posts: 15Questions: 4Answers: 0

Hello,

i updated Datatbles from 1.9.1 to 1.10.0 and now i direcly get Error message "Cannot read property 'oApi' of undefined".
I load the scripts with require.js and i am sure that the load order is correct (jquery, datatable, plugins)...

require:
DataTables: {deps: ['jQuery','Underscore'], exports: 'DataTables'},

A look into the Timeline of Debug Console shows that jquery is loaded before datatables and all plugins after datatables.

Does anyone have an idea ?

This question has an accepted answers - jump to answer

Answers

  • tengelstengels Posts: 15Questions: 4Answers: 0

    PS: jquery is 1.7.1... so requirements are ok ... the error shows up with jquery 1.11, too

  • allanallan Posts: 63,642Questions: 1Answers: 10,492 Site admin

    Can you link to a page showing the problem please?

    Thanks,
    Allan

  • tengelstengels Posts: 15Questions: 4Answers: 0

    Hi Allan,

    I am sorry but thats not possible because its a secured internal websystem.

    I also get a "undefined is not a function" with the new version. so datatables seems not to be loaded at all.. but it is. If i rename the file i get 404 error so with corrent name it is definitely loaded (as i can see in the ressources log in google chrome)

  • allanallan Posts: 63,642Questions: 1Answers: 10,492 Site admin

    I'm afraid I'd need a way of being able to reproduce the problem to be able to offer any help. Perhaps you can use JSFiddle or similar to provide a test case?

    Allan

  • tengelstengels Posts: 15Questions: 4Answers: 0

    Hi Allan,

    ill try to give you usable data tomorrow.. have to leave :-)

  • tengelstengels Posts: 15Questions: 4Answers: 0
    edited June 2014

    Good morning :-)

    i Load the following way:

    1. index.html
      Loading main.js (data-main:"js/main.js" src="js/libs/require/require.js")

    2. main.js:
      require.config({

      baseUrl: '',
      paths: {
      jQuery: 'path to jquery-min1.7.1',
      DataTables: 'path to DataTables 1.10',
      },
      shim: {
      jQuery: {
      exports: '$'
      },
      DataTables: {
      deps: ['jQuery'],
      exports: 'DataTables'
      }
      ...
      });

    3. JS File where i neet datatables, loaded with backbone.js:
      define(['jQuery','DataTables'],function($,DataTables) {
      render: function(){
      List = $('#DataTable_List').dataTable( {....});
      }
      }

    If i change Datatables js Path to DataTables 1.9.1 in Step 2 everything works fine. But not with Version 1.10..(File Path is correct)
    I allready tried just to replace the .js File of the versions in the directory path of the DataTables Plugin but that doesn`t work, too.

  • allanallan Posts: 63,642Questions: 1Answers: 10,492 Site admin

    I suspect you might need to use datatable as the name since DataTables is a named module.

    Allan

  • tengelstengels Posts: 15Questions: 4Answers: 0
    edited June 2014

    no thats correct. "Datatables" here is only the namespace of require. this name can be used in other JS files to make the module usable. There you give in that namespace and require loads the named module before rendering.

    the only think that i change is the source JS File of datatables (replace the js file within the directory.

    the html keeps the same
    the require routine keeps the same
    the loading of the plugins after loading datatables keeps the same

    putting the datatables 1.9.1 JS file in the source directory : no load errors, working

    putting the datatables 1.10 JS file in the source directory : no load errors, NOT working

    is it possible that datatables 1.10 does not work good with require.js ?

  • allanallan Posts: 63,642Questions: 1Answers: 10,492 Site admin

    I've seen 1.10 being used with Require.js before, but the naming was important. Could you try using datatables and seeing what happens?

    I'm planning on writing up a blog post about using Require with DataTables and the extensions soon (I need to release the extensions with a small update first though).

    Allan

  • tengelstengels Posts: 15Questions: 4Answers: 0
    edited June 2014

    Hi Allan,

    i replaces DataTables with DataTable everywhere but nothing changed..

    i replaces DataTable with DataTables everywhere but nothing changed..

    case sensitive is no matter here, is it ?

  • allanallan Posts: 63,642Questions: 1Answers: 10,492 Site admin

    Yes, I think it does matter. But I'm not certain. As I say, I will be doing some work with RequireJS myself soon and will blog about it as soon as I get a chance.

    Allan

  • tengelstengels Posts: 15Questions: 4Answers: 0
    edited July 2014

    Hi allan,

    i`ve got it to work now :-) You were right I had to name the Namespace to "datatables" in Require.js-Paths. Case sensitive. And I had to change that in every File i load a datatable.

    Aftwerwards I had to change all parts of bootstrap pagination.. Now its working :-)

    Thank you very much !

  • allanallan Posts: 63,642Questions: 1Answers: 10,492 Site admin

    Excellent to hear you got it working.

    Allan

  • allanallan Posts: 63,642Questions: 1Answers: 10,492 Site admin
    Answer ✓

    Excellent to hear you got it working.

    Allan

  • tengelstengels Posts: 15Questions: 4Answers: 0
    edited July 2014

    Thanks for your help :-)

  • tengelstengels Posts: 15Questions: 4Answers: 0
    edited July 2014

    Hi again ...

    since I updated datatables and converted the parameter names, the lengthMenu function is not working.

    I have a datatable without lengthMenu so default [ 10, 25, 50, 100 ] should be loaded, but I get the full List.

    The Area with the dropdown is not there any more... but sDom (new:dom) has not changed

    The DOM Element is still created but not the select element

    Any Idea ?


    PS: change from "sAjaxSource" to "ajax" seems to destroy the filtering.

This discussion has been closed.