6

I'm trying to use the "yadcf" filtering plugin with datatables and getting "Uncaught TypeError: undefined is not a function" as an error where the yadcf function is called.

I have verified that the plugin is loaded, I'm not sure what the problem is.

Here are the libraries being loaded:

<script type="text/javascript" charset="utf-8" src="/DataTables/media/js/jquery-1.10.2.js"></script>
<script type="text/javascript" charset="utf-8" src="/DataTables/jquery-ui-1.10.3/ui/jquery-ui.js"></script>

<script type="text/javascript" charset="utf-8" src="/DataTables-1.10.0/media/js/nightly2.js"></script>
<script type="text/javascript" charset="utf-8" src="/yadcf-0.7.4/jquery.dataTables.yadcf.js"></script>

The css files:

<style type="text/css" title="currentStyle">
    @import "/DataTables/media/css/demo_table.css";
    @import "/yadcf-0.7.4/jquery.dataTables.yadcf.css";
    @import "/DataTables/examples/examples_support/themes/ui-lightness/jquery-ui-1.8.4.custom.css";

</style>

The datatable:

oTable = $('#FE_Time_Table').DataTable( {
   "ajax":{"url": 'FE_Data.php', "dataSrc":'data'},
   "jQueryUI": true,  //Allow use of jquery-ui plug-in for themes
   "dom": 'W<"H"frCi>tS<"">', //Settings for where all the options appear on the page

   "columns": [
        { "name": "plate_no", "data": "plate_no", "className": "center_text" },
        { "name": "job_no", "data": "job_no", "className": "center_text" },
        { "name": "customer", "data": "customer" },
        { "name": "device", "data": "device" },
              ]

   }).yadcf([{column_number : 0}]);
Daniel
  • 36,833
  • 10
  • 119
  • 200
user3101337
  • 364
  • 8
  • 24
  • You are using datatables 1.10.x, as far as I can read, yadcf does not support 1.10.x, yet (!!) -> http://datatables.net/forums/discussion/15016/yet-another-datatables-column-filter-yadcf/p2 – davidkonrad Jul 03 '14 at 09:30
  • I've tried using 1.10.0 which is the last release. It still doesn't work, but the yadcf website says it is supported – user3101337 Jul 03 '14 at 22:40
  • previous version of yadcf did support 1.10.0 but not the new datatables API (capital "D") , anyway latest yadcf does support the new API too – Daniel Aug 04 '14 at 14:04

1 Answers1

12

You need to use the latest yadcf version 0.8.2 , grab it from github repo

Then you should use the new init function of yadcf, like this

var Table = $('#FE_Time_Table').DataTable(...);
yadcf.init(Table , [{column_number : 0}]);

you can see this new init function in use on the showcase

p.s I'm the author of yadcf

Daniel
  • 36,833
  • 10
  • 119
  • 200
  • update, yadcf 0.8.2 was released yesterday, Support: new Datatable API - use yadcf.init(...) / Select2 / ColVis – Daniel Aug 05 '14 at 06:23
  • @Daniel Please update your docs. This had me wondering for 30 minutes. These docs are out of date. http://yadcf-showcase.appspot.com/DOM_source.html – SpoiledTechie.com Feb 23 '17 at 17:55
  • @SpoiledTechie.com , I wont be able to do it in the near future but since the showcase is public https://github.com/vedmack/yadcf-showcase feel free to send PR – Daniel Feb 23 '17 at 18:12