SCRIPT438 error yadcf

I'm just testing yadcf but I keep getting SCRIPT438 error in IE (in ff it is TypeError: $(...).DataTable(...).yadcf is not a function)

and I'm quite sure my libraries are on the right place, I can browse them using developer tools

What am I doing wrong ?

using version 0.9.2

this is my example:

<html>
<head>
<LINK href="DataTables-1.10.11/css/jquery.dataTables.min.css" rel="stylesheet" type="text/css">
<LINK href="yadcf-0.9.2/jquery.dataTables.yadcf.css" rel="stylesheet" type="text/css">

<SCRIPT SRC=jquery-1.11.3.min.js TYPE=text/javascript></SCRIPT>
<SCRIPT SRC=DataTables-1.10.11/js/jquery.dataTables.min.js TYPE=text/javascript></SCRIPT>
<SCRIPT SRC=yadcf-0.9.2/jquery.dataTables.yadcf.js TYPE=text/javascript></SCRIPT>


    <script>
	$(document).ready( function () {
	// alert("press format data");

	     $('#ResTbl').DataTable({
	"columnDefs": [
		     
            {
                "targets": [ 0 ],
              //  "visible": false,
			  "orderable": false ,
                "searchable": false
            } 
			]
	
	}).yadcf( [
	{column_number : 2, filter_type: "range_number_slider"} ,
    //  {column_number : 0, data: ["MOD", "CON"], filter_default_label: "..."}, 
      {column_number: 1, filter_type: "auto_complete",  text_data_delimiter: ","  }
]);

} );


</script>

</head>
<body>

<table id="ResTbl" class="compact">
    <thead>
        <tr>
            <th>Column 1</th>
            <th>Column 2</th>
            <th>Column 3</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Row 1 Data 1</td>
            <td>Row 1 Data 2</td>
            <td>1</td>
        </tr>
        <tr>
            <td>Row 2 Data 1</td>
            <td>Row 2 Data 2</td>
            <td>2</td>
        </tr>
        <tr>
            <td>Row 3 Data 1</td>
            <td>Row 3 Data 2</td>
            <td>3</td>
        </tr>
        <tr>
            <td>Row 4 Data 1</td>
            <td>Row 4 Data 2</td>
            <td>4</td>
        </tr>
        <tr>
            <td>Row 5 Data 1</td>
            <td>Row 5 Data 2</td>
            <td>5</td>
        </tr>
        <tr>
            <td>Row 6 Data 1</td>
            <td>Row 6 Data 2</td>
            <td>6</td>
        </tr>
        <tr>
            <td>Row 7 Data 1</td>
            <td>Row 7 Data 2</td>
            <td>7</td>
        </tr>
        <tr>
            <td>Row 8 Data 1</td>
            <td>Row 8 Data 2</td>
            <td>8</td>
        </tr>
        <tr>
            <td>Row 9 Data 1</td>
            <td>Row 9 Data 2</td>
            <td>9</td>
        </tr>
        <tr>
            <td>Row 10 Data 1</td>
            <td>Row 10 Data 2</td>
            <td>10</td>
        </tr>
        <tr>
            <td>Row 11 Data 1</td>
            <td>Row 11 Data 2</td>
            <td>11</td>
        </tr>
        <tr>
            <td>Row 12 Data 1</td>
            <td>Row 12 Data 2</td>
            <td>12</td>
        </tr>

		
    </tbody>
</table>


</body>
</html>

What am i doin wrong ?

Solution

You are using new Datatables api with old yadcf api

From the showcase:

note that this is the old yadcf API for init the filters new init function should be used when working with new Datatable (capital "D" API) for new init function see: DOM_Ajax_Multiple_1.10.html

When you constructing the dataables using the "Capital letter D" it returns an object (which is not a jquery object) therefor you must use the yadcf.init() function to inityadcf upon it, like that:

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

Anyway go over the docs (inside the yadcf js file) to learn about all yadcf goodies...