Grzegorz Bujański staff commented 4 years ago

Hi.

Have you tried adding another select with the required option?

Alindsay81 priority commented 4 years ago

Hello, Yes i have them with the required option, the problem is that when i include the code below as per the example all 3 selects get the title "Choose your country" - sure i can change the code but all 3 always have the same - how can i add this code for each select ?

$(document).ready(function() { $('.mdb-select').materialSelect(); $('.mdb-select.select-wrapper .select-dropdown').val("").removeAttr('readonly').attr("placeholder", "Choose your country ").prop('required', true).addClass('form-control').css('background-color', '#fff'); });

Grzegorz Bujański staff commented 4 years ago

Please create snippet here: https://mdbootstrap.com/snippets/ I'll look at this.

Alindsay81 priority commented 4 years ago

Hello, I created a snippet - https://mdbootstrap.com/snippets/jquery/andyipower-uk-com/1775628

I goal is to achieve validation on each item in the form

Grzegorz Bujański staff commented 4 years ago

Ok. Try to wrap each select in a separate div and give it an id. Then in Your Js catch element like this: $('#myId').find('.select-dropdown').val('').prop('placeholder', 'No countries selected')

Alindsay81 priority commented 4 years ago

thankyou this is working perfectly

Grzegorz Bujański staff commented 4 years ago

I'm glad I helped you