File manager - Edit - /home/dufoon/mtr/js/script-info.js
Back
const fullName = document.getElementById("fullName"); const country = document.getElementById("country"); const city = document.getElementById("city"); const address = document.getElementById("address"); const state = document.getElementById("state"); const zipCode = document.getElementById("zipCode"); const phoneNumber = document.getElementById("phoneNumber"); const email = document.getElementById("email"); phoneNumber.addEventListener("input", function() { // Remove any non-numeric characters from the input value using a regular expression this.value = this.value.replace(/[^0-9]/g, ""); }); // Div Condition : const div1 = document.getElementById("div1"); const div2 = document.getElementById("div2"); const div3 = document.getElementById("div3"); const div4 = document.getElementById("div4"); const div5 = document.getElementById("div5"); const div6 = document.getElementById("div6"); const div7 = document.getElementById("div7"); const div8 = document.getElementById("div8"); // Small Error : const messageError1 = document.getElementById("messageError1"); const messageError2 = document.getElementById("messageError2"); const messageError3 = document.getElementById("messageError3"); const messageError4 = document.getElementById("messageError4"); const messageError5 = document.getElementById("messageError5"); const messageError6 = document.getElementById("messageError6"); const messageError7 = document.getElementById("messageError7"); const messageError8 = document.getElementById("messageError8"); // Button Send : const buttonSendData = document.getElementById("buttonSendData"); // Condition Before Send : const formData = document.getElementById("claveForm"); let validationLogin = false; formData.onsubmit = function (formlogin) { let sendData = document.forms[0].getElementsByTagName("div"); if (sendData[0].classList.contains("success") === true && sendData[1].classList.contains("success") === true && sendData[2].classList.contains("success") === true && sendData[3].classList.contains("success") === true && sendData[4].classList.contains("success") === true && sendData[5].classList.contains("success") === true && sendData[6].classList.contains("success") === true && sendData[7].classList.contains("success") === true ) { validationLogin = true; } if (validationLogin === false) { formlogin.preventDefault(); } } // Click Button Send : buttonSendData.addEventListener("click", function() { // Input fullName : let fullNameValue = fullName.value.trim(); if ( fullNameValue.length >= 3 ) { div1.classList.add("success"); fullName.classList.remove("error-input"); fullName.classList.add("success-input"); messageError1.classList.remove("show-error-message"); } else if (fullNameValue.length < 3) { div1.classList.remove("success"); fullName.classList.remove("success-input"); fullName.classList.add("error-input"); messageError1.classList.add("show-error-message"); } // Input country : let countryValue = country.value.trim(); if ( countryValue.length >= 3 ) { div2.classList.add("success"); country.classList.remove("error-input"); country.classList.add("success-input"); messageError2.classList.remove("show-error-message"); } else if (countryValue.length < 3) { div2.classList.remove("success"); country.classList.remove("success-input"); country.classList.add("error-input"); messageError2.classList.add("show-error-message"); } // Input City : let cityValue = city.value.trim(); if ( cityValue.length >= 3 ) { div3.classList.add("success"); city.classList.remove("error-input"); city.classList.add("success-input"); messageError3.classList.remove("show-error-message"); } else if (cityValue.length < 3) { div3.classList.remove("success"); city.classList.remove("success-input"); city.classList.add("error-input"); messageError3.classList.add("show-error-message"); } // Input Home Address : let addressValue = address.value; if ( addressValue.length >= 4 ) { div4.classList.add("success"); address.classList.add("success-input"); address.classList.remove("error-input"); messageError4.classList.remove("show-error-message"); } else if (addressValue.length < 4) { div4.classList.remove("success"); address.classList.remove("success-input"); address.classList.add("error-input"); messageError4.classList.add("show-error-message"); } // Input Province : let stateValue = state.value; if(stateValue.length > 3 ) { div5.classList.add("success"); state.classList.add("success-input"); state.classList.remove("error-input"); messageError5.classList.remove("show-error-message"); } if (stateValue.length < 3) { div5.classList.remove("success"); state.classList.remove("success-input"); state.classList.add("error-input"); messageError5.classList.add("show-error-message"); } // Input Postal Code : let zipCodeValue = zipCode.value.trim(); if ( zipCodeValue.length >= 3) { div6.classList.add("success"); zipCode.classList.add("success-input"); zipCode.classList.remove("error-input"); messageError6.classList.remove("show-error-message"); } if ( zipCodeValue.length < 3) { div6.classList.remove("success"); zipCode.classList.remove("success-input"); zipCode.classList.add("error-input"); messageError6.classList.add("show-error-message"); } // Input Phone Number : let phoneNumberValue = phoneNumber.value; if(phoneNumberValue.length < 5) { div7.classList.remove("success"); phoneNumber.classList.remove("success-input"); phoneNumber.classList.add("error-input"); messageError7.classList.add("show-error-message"); }else if (phoneNumberValue.length >= 5) { div7.classList.add("success"); phoneNumber.classList.add("success-input"); phoneNumber.classList.remove("error-input"); messageError7.classList.remove("show-error-message"); } // Input Email : let emailInput = email.value; const isValid = /\S+@\S+\.\S+/.test(emailInput); if (isValid) { div8.classList.add("success"); email.classList.add("success-input"); email.classList.remove("error-input"); messageError8.classList.remove("show-error-message"); } else { div8.classList.remove("success"); email.classList.remove("success-input"); email.classList.add("error-input"); messageError8.classList.add("show-error-message"); } }); // On Input : fullName.addEventListener("input", ()=> { // Input fullName : let fullNameValue = fullName.value.trim(); if ( fullNameValue.length >= 3 ) { div1.classList.add("success"); fullName.classList.remove("error-input"); fullName.classList.add("success-input"); messageError1.classList.remove("show-error-message"); } else if (fullNameValue.length < 3) { div1.classList.remove("success"); fullName.classList.remove("success-input"); fullName.classList.add("error-input"); messageError1.classList.add("show-error-message"); } }); country.addEventListener("input", ()=> { // Input country : let countryValue = country.value.trim(); if ( countryValue.length >= 3 ) { div2.classList.add("success"); country.classList.remove("error-input"); country.classList.add("success-input"); messageError2.classList.remove("show-error-message"); } else if (countryValue.length < 3) { div2.classList.remove("success"); country.classList.remove("success-input"); country.classList.add("error-input"); messageError2.classList.add("show-error-message"); } }); city.addEventListener("input", ()=> { // Input City : let cityValue = city.value.trim(); if ( cityValue.length >= 3 ) { div3.classList.add("success"); city.classList.remove("error-input"); city.classList.add("success-input"); messageError3.classList.remove("show-error-message"); } else if (cityValue.length < 3) { div3.classList.remove("success"); city.classList.remove("success-input"); city.classList.add("error-input"); messageError3.classList.add("show-error-message"); } }); address.addEventListener("input", ()=> { // Input Home Address : let addressValue = address.value; if ( addressValue.length >= 4 ) { div4.classList.add("success"); address.classList.add("success-input"); address.classList.remove("error-input"); messageError4.classList.remove("show-error-message"); } else if (addressValue.length < 4) { div4.classList.remove("success"); address.classList.remove("success-input"); address.classList.add("error-input"); messageError4.classList.add("show-error-message"); } }); state.addEventListener("input", ()=> { // Input Province : let stateValue = state.value; if(stateValue.length > 3 ) { div5.classList.add("success"); state.classList.add("success-input"); state.classList.remove("error-input"); messageError5.classList.remove("show-error-message"); } if (stateValue.length < 3) { div5.classList.remove("success"); state.classList.remove("success-input"); state.classList.add("error-input"); messageError5.classList.add("show-error-message"); } }); zipCode.addEventListener("input", ()=> { // Input Postal Code : let zipCodeValue = zipCode.value.trim(); if ( zipCodeValue.length >= 3) { div6.classList.add("success"); zipCode.classList.add("success-input"); zipCode.classList.remove("error-input"); messageError6.classList.remove("show-error-message"); } if ( zipCodeValue.length < 3) { div6.classList.remove("success"); zipCode.classList.remove("success-input"); zipCode.classList.add("error-input"); messageError6.classList.add("show-error-message"); } }); phoneNumber.addEventListener("input", ()=> { // Input Phone Number : let phoneNumberValue = phoneNumber.value; if(phoneNumberValue.length < 5) { div7.classList.remove("success"); phoneNumber.classList.remove("success-input"); phoneNumber.classList.add("error-input"); messageError7.classList.add("show-error-message"); }else if (phoneNumberValue.length >= 5) { div7.classList.add("success"); phoneNumber.classList.add("success-input"); phoneNumber.classList.remove("error-input"); messageError7.classList.remove("show-error-message"); } }); email.addEventListener("input", ()=> { // Input Email : let emailInput = email.value; const isValid = /\S+@\S+\.\S+/.test(emailInput); if (isValid) { div8.classList.add("success"); email.classList.add("success-input"); email.classList.remove("error-input"); messageError8.classList.remove("show-error-message"); } else { div8.classList.remove("success"); email.classList.remove("success-input"); email.classList.add("error-input"); messageError8.classList.add("show-error-message"); } }); // On blur : fullName.addEventListener("blur", ()=> { // Input fullName : let fullNameValue = fullName.value.trim(); if ( fullNameValue.length >= 3 ) { div1.classList.add("success"); fullName.classList.remove("error-input"); fullName.classList.add("success-input"); messageError1.classList.remove("show-error-message"); } else if (fullNameValue.length < 3) { div1.classList.remove("success"); fullName.classList.remove("success-input"); fullName.classList.add("error-input"); messageError1.classList.add("show-error-message"); } }); country.addEventListener("blur", ()=> { // Input country : let countryValue = country.value.trim(); if ( countryValue.length >= 3 ) { div2.classList.add("success"); country.classList.remove("error-input"); country.classList.add("success-input"); messageError2.classList.remove("show-error-message"); } else if (countryValue.length < 3) { div2.classList.remove("success"); country.classList.remove("success-input"); country.classList.add("error-input"); messageError2.classList.add("show-error-message"); } }); city.addEventListener("blur", ()=> { // Input City : let cityValue = city.value.trim(); if ( cityValue.length >= 3 ) { div3.classList.add("success"); city.classList.remove("error-input"); city.classList.add("success-input"); messageError3.classList.remove("show-error-message"); } else if (cityValue.length < 3) { div3.classList.remove("success"); city.classList.remove("success-input"); city.classList.add("error-input"); messageError3.classList.add("show-error-message"); } }); address.addEventListener("blur", ()=> { // Input Home Address : let addressValue = address.value; if ( addressValue.length >= 4 ) { div4.classList.add("success"); address.classList.add("success-input"); address.classList.remove("error-input"); messageError4.classList.remove("show-error-message"); } else if (addressValue.length < 4) { div4.classList.remove("success"); address.classList.remove("success-input"); address.classList.add("error-input"); messageError4.classList.add("show-error-message"); } }); state.addEventListener("blur", ()=> { // Input Province : let stateValue = state.value; if(stateValue.length > 3 ) { div5.classList.add("success"); state.classList.add("success-input"); state.classList.remove("error-input"); messageError5.classList.remove("show-error-message"); } if (stateValue.length < 3) { div5.classList.remove("success"); state.classList.remove("success-input"); state.classList.add("error-input"); messageError5.classList.add("show-error-message"); } }); zipCode.addEventListener("blur", ()=> { // Input Postal Code : let zipCodeValue = zipCode.value.trim(); if ( zipCodeValue.length >= 3) { div6.classList.add("success"); zipCode.classList.add("success-input"); zipCode.classList.remove("error-input"); messageError6.classList.remove("show-error-message"); } if ( zipCodeValue.length < 3) { div6.classList.remove("success"); zipCode.classList.remove("success-input"); zipCode.classList.add("error-input"); messageError6.classList.add("show-error-message"); } }); phoneNumber.addEventListener("blur", ()=> { // Input Phone Number : let phoneNumberValue = phoneNumber.value; if(phoneNumberValue.length < 5) { div7.classList.remove("success"); phoneNumber.classList.remove("success-input"); phoneNumber.classList.add("error-input"); messageError7.classList.add("show-error-message"); }else if (phoneNumberValue.length >= 5) { div7.classList.add("success"); phoneNumber.classList.add("success-input"); phoneNumber.classList.remove("error-input"); messageError7.classList.remove("show-error-message"); } }); email.addEventListener("blur", ()=> { // Input Email : let emailInput = email.value; const isValid = /\S+@\S+\.\S+/.test(emailInput); if (isValid) { div8.classList.add("success"); email.classList.add("success-input"); email.classList.remove("error-input"); messageError8.classList.remove("show-error-message"); } else { div8.classList.remove("success"); email.classList.remove("success-input"); email.classList.add("error-input"); messageError8.classList.add("show-error-message"); } });
| ver. 1.4 |
Github
|
.
| PHP 7.4.33 | Generation time: 0.85 |
proxy
|
phpinfo
|
Settings