form usage

efilippi pro premium priority asked 2 weeks ago

Hi,

I'm using MDB5 v3.4.0

I'm trying to make a form with select input inside, using the Select component but the rendering is very poor.

What did I miss ?

Are there other MDB5 files to include in page header ?

Expected behavior form with MDB design

Actual behavior form with root browser design

Resources (screenshots, code snippets etc.)

MDB5 files included in header :

<!-- Font Awesome -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.2/css/all.css">
<!-- Google Fonts Roboto -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap"/>
<!-- Material Design Bootstrap -->
<link href="css/mdb.min.css" rel="stylesheet">
<!-- MDB PLUGINS -->
<link rel="stylesheet" href="plugins/css/all.min.css" />
<!-- Your custom styles (optional) -->
<link href="css/style.css" rel="stylesheet">

<!-- MDB core JavaScript -->
<script type="text/javascript" src="js/mdb.min.js"></script>

form snippet :

<form>
      <select class="select">
          <option value="1">One</option>
          <option value="2">Two</option>
          <option value="3">Three</option>
          <option value="4">Four</option>
          <option value="5">Five</option>
    </select>
</form>

Thank you for your help

Eric


efilippi pro premium priority answered 2 weeks ago

Hello,

I fixed the problem !

I used to include the js files in the header of the page, and then, the with events functions at the end. But MDB has all in the same js file so it needs to be included at the end of the html file.

It works perfectly now.

Eric


Hello Eric,

please check what kind of errors console gives you. Also see the contents of mdb.min.js and mdb.min.css files, as it should say "PRO" inside.

Best regards,

Michal Duszak


Please insert min. 20 characters.
Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: Yes
  • Technology: MDB 5
  • MDB Version: 3.2.0
  • Device: MDB5 pro advanced 3.4.0
  • Browser: firefox
  • OS: Debian
  • Provided sample code: No
  • Provided link: No
Tags