Topic: Select fields disappear

aeromir free asked 5 years ago


I already have bootstrap integrated in my member's website. I expect adding the MDB css library wouldn't change the display and function of my site.

When I add the MDB css library, my select fields disappear (display:none)


Piotr Glejzer staff commented 5 years ago

Do you have some example of this problem? You can put it in our snippets https://mdbootstrap.com/snippets/.


aeromir free commented 5 years ago

Here is a sample:

Without MDB: https://my.aeromir.com/temp1.cfm

With MDB: https://my.aeromir.com/temp1b.cfm

The Source and Type drop downs and the delete checkbox disappear on the second version.

This style definition in your mdb.css file seems to be causing the problem:

select { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; display: none !important; }


Piotr Glejzer staff commented 5 years ago

which version do you use? 4.8.2?
do you use our initial code start? like that :
$('mdb-select').materialSelect();


aeromir free commented 5 years ago

4.8.1.I only see a download for 4.8.2 free. Where do I go for a pro 4.8.2 download?

I added this to the bottom of the page

http://f1.aeromir.com.s3-us-east-2.amazonaws.com/2/2019/05/mdbdebug.png


Piotr Glejzer staff commented 5 years ago

You should have a link on your profile. You initiate a material_select with '.mdb-select' class but you don't have this class in your HTML file.


aeromir free commented 5 years ago

Thanks for pointing me to the download link.

Do I have to add the material_select class to every select field on my site to prevent them from disappearing?


aeromir free commented 5 years ago

I still can't get this to work. I simplified it on this page:

https://my.aeromir.com/mdb.cfm

This is directly from an example you posted on this page:

https://mdbootstrap.com/support/general/mdb-select-2/

As you can see, the select field is not displayed.

I checked all of the files and they are all loading. I'm using 4.8.2.

What is wrong?


aeromir free commented 5 years ago

I found out part of the solution. Your javascript was incorrect in the example above. This is the correct js:

$( document ).ready(function() { $('.mdb-select').material_select(); });

aeromir free commented 5 years ago

Next question is can I use a select WITHOUT mdb?

Your checkboxes are also confusing. I found documentation of how to add them but it only works with one checkbox per page as you use the ID attribute, which has to be unique for each checkbox.

See https://my.aeromir.com/temp1b.cfm


Piotr Glejzer staff commented 5 years ago

You are posting tag script in a wrong place. You have to post it below scripts with jquery, popperr.min , mdb.js, and others. I don't understand your question about 'can I use select..'. Yes, you can use it. We using camelCase and snake_case in material select to initiate this component but we will remove snake_case dependency ( material_select) in the nearly future. Checkboxes should have a unique id to connect with label name.



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.8.0
  • Device: Desktop
  • Browser: Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: No
Tags