vedmack / yadcf

Yet Another DataTables Column Filter (yadcf)
http://yadcf-showcase.appspot.com/
MIT License
732 stars 284 forks source link

autocomplete is not a function #626

Closed jnaklaas closed 4 years ago

jnaklaas commented 4 years ago

I'm having an issue with the auto_complete filter type.

When changing the filter type to text, it all works as expected. When using auto_complete filtering does not work on any of the columns.

Console shows:

TypeError: $(...).autocomplete is not a function

My js code:

let propertiesTable = $('.properties-table').DataTable({
    columnDefs: [
       { type: 'natural', targets: 0 }
     ],
     language: {
          url: dataTablesI18nUrl
      }
  });
  // yadcf DataTable filter init
  yadcf.init(propertiesTable, [{
    column_number: 0,
    filter_type: 'text',
    filter_default_label: (sales_object.language === 'nl') ? 'Typ om te filteren' : 'Type to filter',
  }, {
    column_number: 1,
    // select_type: 'chosen',
    select_type_options: {
        search_contains: true
    },
    filter_default_label: (sales_object.language === 'nl') ? 'Selecteer type' : 'Select type',
  }, {
    column_number: 2,
    // select_type: 'chosen',
    select_type_options: {
        search_contains: true
    },
    filter_default_label: (sales_object.language === 'nl') ? 'Selecteer aantal' : 'Select number',
  }, {
    column_number: 6,
    filter_type: 'auto_complete',
  }]);

PS I commented out select_type: 'chosen', because it too throws an error when used, but works flawlessly when omitted.

vedmack commented 4 years ago

Hi

You should add js/css of any third party jquery plugin in order to use them.

See TypeError: $(…).autocomplete is not a function

jnaklaas commented 4 years ago

Thanks, apparently the jquery ui that I was using did not include the entire library.

Ynjxsjmh commented 4 years ago

Encountered into the same problem, as is stated in README

autocomplete input - make use of the jQuery UI Autocomplete widget (with some enhancements)

Solved by including jquery-ui.js before jquery.dataTables.yadcf.js.