Quiero cambiar el valor del botón Enviar formulario a "Cargando..." con JAVA SCRIPT solo si todos los campos obligatorios del formulario están completos. Por favor, ayuda. ¡¡¡Gracias!!!
<form> <div> <input id="my-file" name="my-file" type="file" accept="image/png, image/gif, image/jpeg" required> </div> <div> <input type="email" value="" name="my_email" required> </div> <div> <input id="visible_submit" type="submit" value="Submit"> </div> </form> <script type="text/javascript"> var mySubmit = document.getElementById("visible_submit"); mySubmit.onclick = function addLoading() { document.getElementById("visible_submit").setAttribute("value", "Loading...");};En lugar de escuchar el evento de click en el botón de envío, escuche el evento de submit en el formulario.
Utilice checkValidity() para comprobar si el usuario ha rellenado todos los campos obligatorios y Event.preventDefault() para evitar el envío de formularios:
var mySubmit = document.getElementById("visible_submit"); const form = document.querySelector('form'); form.addEventListener('submit', function(e) { if (form.checkValidity()) { document.getElementById("visible_submit").value = "Loading..."; } e.preventDefault(); }) <form> <div> <input id="my-file" name="my-file" type="file" accept="image/png, image/gif, image/jpeg" required> </div> <div> <input type="email" value="" name="my_email" required> </div> <div> <input id="visible_submit" type="submit" value="Submit"> </div> </form>