Hi Everyone,
I am trying to move a website over to a new design and need to make sure the login form works the same as the old site. I have added the javascript and built the same form but I am getting too many redirect errors.
Here is the live website form that works as expected.
The page is in Landlorld > Referral > Signup and the custom code is in the page before /body>.
<script>
function changeEntry(){
document.getElementById('signup-error').innerHTML = ''
validForm();
}
function clearForm(){
var myForm = document.getElementById('signup-form');
myForm.reset();
// document.getElementById('server-msg').className = 'hide-msg';
hideSuccessMsg();
myForm.hidden = false;
}
function showSuccessMsg() {
document.querySelector("#show-on-success").style.display = "block";
document.querySelector("#hide-on-success").style.display = "none";
}
function hideSuccessMsg() {
document.querySelector("#show-on-success").style.display = "none";
document.querySelector("#hide-on-success").style.display = "block";
}
function setCookie(cname, cvalue, exdays) {
var d = new Date();
d.setTime(d.getTime() + 0);
var expires = "expires="+ d.toUTCString();
document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}
function validForm(){
setCookie('tencube-cs');
document.getElementById("signup-error").innerHTML = "";
var msg = "";
var inpObj = document.getElementById("email");
if (!inpObj.checkValidity()) {
msg = inpObj.id +':' +inpObj.validationMessage + '<br/>';
}
inpObj = document.getElementById("pwd");
if (!inpObj.checkValidity()) {
msg += inpObj.id +':' +inpObj.validationMessage + '<br/>';
}
inpObj = document.getElementById("pwd_confirm");
if (!inpObj.checkValidity()) {
msg += inpObj.id +':' +inpObj.validationMessage+ '<br/>';
}
if (msg != ""){
document.getElementById("signup-error").innerHTML = msg;
return false;
}
return true;
}
function encrypt(){
var pass = document.getElementById('pwd').value;
var hide = document.getElementById('pwd-hide').value;
document.getElementById("pwd-hide").value = pass.value;
var hash = btoa(pass);
var pass_confirm = document.getElementById('pwd_confirm').value;
document.getElementById('pwd').value = hash;
document.getElementById('pwd_confirm').value = btoa(pass_confirm);
return true;
}
function signupAccount(){
if (!validForm()) {
document.getElementById('signup-error').className += " " + 'show-msg';
return false
};
document.getElementById('signup-error').className += " " + 'hide-msg';
encrypt();
var url = document.getElementById('signup-path').value;
var myForm = document.getElementById('signup-form');
var loadingDiv = document.getElementById('loadingDiv');
var formData = new FormData(myForm);
var xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function(){
if(xmlHttp.readyState == 4){
// console.log('test' + xmlHttp.status);
if( xmlHttp.status == 201)
{
myForm.reset();
// myForm.hidden = true;
loadingDiv.style.display = "block";
var data = JSON.parse(this.responseText);
window.location.href = '/thankyou?token='+data['refresh_token'];
}
if(xmlHttp.status == 422){
// console.log(JSON.parse(xmlHttp.responseText));
document.getElementById('pwd').value = '';
document.getElementById('pwd_confirm').value = '';
loadingDiv.style.display = "none";
var errors = JSON.parse(xmlHttp.responseText);
var keys = Object.keys(errors);
for(i=0; i<keys.length; i++){
var errorElem = document.getElementById(keys[i]+'-error');
errorElem.querySelector('input').className += " "+"is-invalid"
errorElem.querySelector('.invalid-feedback').innerHTML = keys[i] +' '+ errors[keys[i]][0];
}
}
}
}
xmlHttp.open("post", url);
xmlHttp.send(formData);
}
</script>
Here is my site Read-Only: LINK