1. MDB Home Page
  2. Support Main Page
  3. MDB Standard
Topic: Problem form select with stepper

ivan89 free asked 3 years ago

I put a select in my test stepper and I get errors in the console: Uncaught ReferenceError: mdb is not defined and other. I initialized with: const Select = new mdb.Select (document.getElementById ('mySelect'), options); Should I call some additional library in the body of the page? I currently have:

<! - MDB libraries ->
    <link rel = "stylesheet" href = "css / mdb.min.css" />
    <! - MDB PLUGINS ->
    <link rel = "stylesheet" href = "plugins / css / all.min.css" />
and at the end of the body:
<! - MDB ->
<script type = "text / javascript" src = "js / mdb.min.js"> </script>
<! - MDB PLUGINS ->
<script type = "text / javascript" src = "plugins / js / all.min.js"> </script>
<! - Custom scripts ->
<script type = "text / javascript" src = "js / custom.js"> </script>

Snippet: https://mdbootstrap.com/snippets/standard/ivan89/3153078/

Thanks in advanced

ivan89 free answered 3 years ago

Thanks so much for the reply, now it works fine. If I want to hide the back button at the first step and the forward button at the last step, is there a component function that makes me do this? Or do I need to write custom javascript code? I tried to insert the buttons inside each step but from the second step it returns me to the first without going to the third.

https://mdbootstrap.com/snippets/standard/ivan89/3171041/

Dawid Wajszczuk staff commented 3 years ago

Hi. You just forgot to include the actions for the second pair of buttons in your JS. Also adding type="button" to your buttons should help. And there was no unique ID in 3rd step (it was duplicated) so I also have changed that. Here is the snippet https://mdbootstrap.com/snippets/standard/d-wajszczuk/3175838

Dawid Wajszczuk staff answered 3 years ago

Hi,

It looks like you have all the necessary imports. One thing that I have noticed is that you try to double initialize the Select, with Select class and then via JS. Choose one option. Here is the snippet with what you are probably trying to accomplish https://mdbootstrap.com/snippets/standard/d-wajszczuk/3155500. Copy and paste this to the body of your project and change the language to fit your needs. It should work fine.

Keep coding,
Dawid

qcoliveros free commented 1 year ago

Field validation is not working in this example, i.e., field outline will be green if no validation error or will be red if have validation error.

Kamila Pieńkowska staff commented 1 year ago

I don't understand what doesn't work for you.

The field title and outline are green for valid input and red for invalid. Validation is triggered when you use a button that changes the step.
Write
Create snippet
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 Standard
  • MDB Version: MDB5 3.8.0
  • Device: PC
  • Browser: Firefox - Chrome
  • OS: Debian 10
  • Provided sample code: No
  • Provided link: Yes
Tags
select-bootstrap-5 form stepper
About author
ivan89
32Support score
1Questions 2Answers 2Snippets