mdb-select validation not show invalid-feedback message


Topic: mdb-select validation not show invalid-feedback message

webdesigna free asked 3 years ago

Expected behavior Hi

mdb-select validation not show invalid-feedback message on click sumbit. Other select validate ok.

For example: https://mdbootstrap.com/snippets/jquery/mandra/397124

Please help! I need solve this issue.

Actual behavior

Resources (screenshots, code snippets etc.)


MDBootstrap staff answered 2 years ago

Hi vilage,

The problem is your last line of JS code.

$('.mdb-select.select-wrapper .select-dropdown').removeAttr('readonly').prop('required', true).addClass('form-control');

You pick both selects with this line. I fixed this behaviour by inspecting this element and copying the selector to the desired input field. This is not the elegant selector but it surely works in this case:

$('body > form > div:nth-child(1) > div:nth-child(3) > div.select-wrapper.mdb-select.md-form > input')

I forked from your snippet and created ready to use solution}.

You can create a more elegant selector for your needs by for example adding the id to the desired select input field.

Best Regards, Piotr


vilage free answered 2 years ago

Hello,

I update the snippet, when we put two selects in the same form, one ir required and other not, this don´t function too. And the searcheable option have a problem.

Is this a problem of the select? Or the construction of the html solve this.

Best, Otavio


vilage free answered 2 years ago

Hi,

we also have problem with select validation, and I trie you code snippet. But this don´t work if one element of the list are selected. The component don´t show this.

I fork your code https://mdbootstrap.com/snippets/jquery/vilage/1112410, if you can see this.

We are using label tag for select elements, so i include this too.

Best, Otavio


MDBootstrap staff answered 3 years ago

Hi webdesigna,

I created snipped with an example of a possible solution for your development. I am aware our material select has some problems, but we will fix its behaviour in the future. Right now try my solution:

https://mdbootstrap.com/snippets/jquery/pjoter-2-0/848712

If you need additional help, I am here for you.

Best Regards, Piotr


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
  • User: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.8.2
  • Device: all
  • Browser: all
  • OS: all
  • Provided sample code: No
  • Provided link: Yes