Topic: Problem form select with stepper
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
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 commented 2 years 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.
kpienkowska staff commented 2 years 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.
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
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: 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