xxxxxxxxxx1
<form class="needs-validation" novalidate>2
3
<div class="form-row">4
5
<!--Grid column-->6
<div class="col-md-4 mb-4">7
<div class="md-form">8
<input type="text" id="form1" class="form-control" required>9
<label for="form1" class="">Campo Requerido*</label>10
<!-- Feedback -->11
<div class="valid-feedback">12
Información válida13
</div>14
<div class="invalid-feedback">15
Este campo es requerido16
</div>17
</div>18
</div>19
20
<!--Grid column-->21
<div class="col-md-4 mb-4">22
23
<div class="md-form">24
<select class="mdb-select" required>25
<option value="" disabled selected>Basic select</option>26
<option value="1">USA</option>27
<option value="2">Germany</option>28
<option value="3">France</option>29
<option value="3">Poland</option>30
<option value="3">Japan</option>31
</select>32
<div class="invalid-feedback">33
Este campo es requerido34
</div>35
</div>36
37
</div>38
<!--Grid column-->39
40
41
</div>42
<!--Grid row-->43
44
<div class="form-group">45
<div class="custom-control custom-checkbox">46
<input type="checkbox" class="custom-control-input" id="invalidCheck33" required>47
<label class="custom-control-label" for="invalidCheck33">Acepto los términos y condiciones</label>48
<div class="invalid-feedback">49
Debes aceptar los términos y condiciones50
</div>51
</div>52
</div>53
54
<button type="submit" class="btn btn-default mt-4 ml-0">Submit</button>55
56
</form>1
1
xxxxxxxxxx1
2
// Material Select Initialization3
$(document).ready(function () {4
$('.mdb-select').material_select();5
$('.mdb-select.select-wrapper .select-dropdown').val("").removeAttr('readonly').attr("placeholder",6
"Basic select").prop('required', true).addClass('form-control').css('background-color', '#fff');7
// Validación Formulario8
validateForms();9
});10
11
// Validate Forms12
function validateForms(){13
// Fetch all the forms we want to apply custom Bootstrap validation styles to14
var forms = document.getElementsByClassName('needs-validation');15
// Loop over them and prevent submission16
var validation = Array.prototype.filter.call(forms, function(form) {17
form.addEventListener('submit', function(event) {18
if (form.checkValidity() === false) {19
event.preventDefault();20
event.stopPropagation();21
}22
form.classList.add('was-validated');23
}, false);24
});25
}26
27
Console errors: 0