xxxxxxxxxx1
<div class="container mt-5 pt-5">2
<select3
class="select"4
id="basic-select"5
data-mdb-validation="true"6
data-mdb-valid-feedback="This value is valid"7
data-mdb-invalid-feedback="This value is invalid"8
data-mdb-clear-button="true"9
>10
<option value="1">One</option>11
<option value="2">Two</option>12
<option value="3">Three</option>13
<option value="4">Four</option>14
<option value="5">Five</option>15
<option value="6">Six</option>16
<option value="7">Seven</option>17
<option value="8">Eight</option>18
</select>19
20
<button id="valid" class="mt-5 btn btn-primary">21
set valid22
</button>23
<button id="invalid" class="mt-5 btn btn-primary">24
set invalid25
</button>26
</div>1
1
xxxxxxxxxx1
const validBtn = document.querySelector('#valid');2
const invalidBtn = document.querySelector('#invalid');3
const select = document.querySelector('.select-input');4
5
validBtn.addEventListener('click', () => {6
select.classList.add('is-valid')7
select.classList.remove('is-invalid')8
})9
10
invalidBtn.addEventListener('click', () => {11
select.classList.add('is-invalid')12
select.classList.remove('is-valid') 13
})14
Console errors: 0