materialSelect Not a function

Mateusz Łubianka staff commented 5 years ago

Hi @ld4unity,

The problem only occurs with select?

Best,

Grzegorz Bujański staff commented 4 years ago

Hi. You should use $('.mdb-select').materialSelect();. Is only select not working or other functions (e.g. Sidenav) too? What does your Webpack config look like? Do you have any errors during compilation or after page load?

RichardT pro premium commented 4 years ago

I have the same problem, Sidenav is working fine, materialSelect isn't.

Grzegorz Bujański staff commented 4 years ago

I need more information to figure out why this doesn't work. Do you have any errors in your console? How do you initialize select? Are you doing this inside document ready function? It would be great if you create a snippet in which I can recreate this bug.

RichardT pro premium commented 4 years ago

I'm using Rails 6 and Webpacker and I have included the pro version with a javascript include tag (like: script src="/js/mdb.min.js" ) so that webpacker won't compile the javascript which would give me an error (Cannot assign to read only property 'exports' of object '#').Both putting the materialSelect() in a script right after the select itself and in the $(function(){}) will give me the error: materialSelect is not a function.Hope this helps

Grzegorz Bujański staff commented 4 years ago

At the moment, if you add our library to a framework that uses a webpack, it is necessary to add individual modules from the src folder. This can be helpful when configuring: https://gist.github.com/PabloCamp0s/a22b810af012d6110e98cb7539e96484#file-material-design-bootstrap-js

RichardT pro premium commented 4 years ago

That works! Thanks

Grzegorz Bujański staff commented 4 years ago

Great, I'm glad it helped you solve your problem.

Marcin Luczak staff commented 3 years ago

This gist is supposed to import all components from the MDB resources directly to your app file, which should be helpful if you are using webpack and you don't want to recompile index.min.js file.

If you are having problems with material select, please describe it, with code snippet preferably and I'll try to help.

Keep coding, Marcin

maxk pro premium priority commented 3 years ago

@Marcin Luczak I've cloned this repo: https://github.com/mattmilan/mdb_rails and added the pro files to it. The Select fields loads as expected however I am still getting the error Uncaught TypeError: $(...).materialSelect is not a function. Why am I able to see the field correctly but materialSelect doesn't exist?

Marcin Luczak staff commented 3 years ago

Hi,

This is not our official package so I can't really tell what is causing your problems. The general rule for the Material Select and all dynamic components in the MDB package is to import all necessary files into your app, check if they are loaded to the page by your scripts/webpack configuration/other bundlers, and make sure you init those components after all scripts are loaded into to page. For jQuery application is common to use Material Select inside the $( document ).ready(function() { // use components }); wrapper.