JSFiddle - React, Tailwind, and code Playground
HTML
<div>
<label>Email 1
<lable/>
<input class="emailrequerido1" name="email_contactopadrino" id="email_contactopadrino" type="email" value="If there is memorized text the button doesnt enable" />
<br/>
<label>Email 2
<lable/>
<input class="emailrequerido2" name="email_contactopadrino" id="email_contactopadrino" type="email" />
<br/>
<label>Email 3
<lable/>
<input class="emailrequerido3" name="email_contactopadrino" id="email_contactopadrino" type="email" />
<br/>
<label>Email 4
<lable/>
<input class="emailrequerido4" name="email_contactopadrino" id="email_contactopadrino" type="email" />
<br/>
<label>Email 5
<lable/>
<input class="emailrequerido5" name="email_contactopadrino" id="email_contactopadrino" type="email" />
<br/>
<button id="enviarForm" type="submit" class="uk-button uk-float-right">Submit</button>
<div/>
CSS
.emailrequerido1 {
width: 300px;
}
JavaScript
$(document).ready(function () {
var elements = document.getElementsByTagName("INPUT");
for (var i = 0; i < elements.length; i++) {
elements[i].oninvalid = function (e) {
e.target.setCustomValidity("");
if (!e.target.validity.valid) {
e.target.setCustomValidity("<?php echo JText::_('COM_CSTUDOMUS_EMAIL_INVALIDO');?>");
}
};
elements[i].oninput = function (e) {
e.target.setCustomValidity("");
};
}
$("#enviarForm").attr('disabled', true);
$(":input").bind("keyup change", function (e) {
var comboVal = $('.emailrequerido1').val() + $('.emailrequerido2').val() + $('.emailrequerido3').val() + $('.emailrequerido4').val() + $('.emailrequerido5').val();
if (comboVal == 'nullnull' || comboVal == "") {
$("#enviarForm").attr('disabled', true);
} else {
$("#enviarForm").removeAttr('disabled');
}
});
});