Error: The select2('close') method was called on an element that is not using Select2

pcpacino2141

I am using Datatables, Yadcf and Select2. I have an Error as soon as I click on any filter using select2. The select2 autocomplete is also not working. The error is. The select2('close') method was called on an element that is not using Select2. Unable to get property 'close' of undefined or null reference. I have placed the select2 cdn above the yadcf cdn. I dont know what the problem. I placed an example here. Watch the console. https://jsfiddle.net/Paul2167/zusvc4ra/
I am using filters that sit outside of the table.

The HTML snippet

<div>
  <span id="external_filter_container1">
  <!-- leave the wrapper contents empty -->
  </span>
</div>

The Datatable Yadcf init

   var oTable;
jQuery( document ).ready( function($) {
  'use strict';

 // start datatable
oTable = $('.mytable2').DataTable( {
    pageLength: 10,
    searching: true
 });
// end datatable

// start yadcf
yadcf.init(oTable, 
 [
  {
   column_number : 0,
   filter_container_id: 'external_filter_container1',
   filter_reset_button_text: false,
   select_type: 'select2',
   filter_default_label: 'First'
   
   },
  {
   column_number : 1, 
   filter_container_id: 'external_filter_container2',
   filter_reset_button_text: false,
   select_type: 'chosen',
   filter_default_label: 'Last'
   }
  ]
 );
// end yadcf

}); // end ready function

pcpacino2141

I only have 2 select filters. If they are both of type select2 then there is no error. But if only 1 filter is set to use select2. Then the error occurs

kthorngren

This is a YADCF issue not Datatables. Found this issue:
https://github.com/vedmack/yadcf/issues/500

Looks like the Developer wants a test case to debug.

Kevin

pcpacino2141

Thank you for finding this Kevin. I will post my example there. Paul