Question

I have created a login form on a wordpress website that will give users access to members only content. I have three functions login() resetPassword() and register().

Both the login() and resetPassword() forms worked perfectly until I added the third function register() and then none of the forms will submit at all.

If I delete the register() function then the other forms start working again. Also if I place the other functions in their own <script> tag then they work as expected, but the register() function still doesn’t function properly.

I have looked over the code again and again, and tried placing it in different areas… I’m not sure what is causing the problem. Has anyone had this happen before? How do I fix it?

<script type="text/javascript">
function login()
{
    var email = document.getElementById("LoginUName").value;
    var pword = document.getElementById("LoginPWord").value;
    var xmlhttp;
    if (window.XMLHttpRequest)xmlhttp=new XMLHttpRequest(); 
    else xmlhttp=new ActiveXObject('Microsoft.XMLHTTP');
    xmlhttp.onreadystatechange=function(){document.getElementById('LoginScreen').innerHTML=xmlhttp.responseText;}
    xmlhttp.open('GET','login.php?EMail='+email+'&PWord='+pword,true);
    xmlhttp.send();
}
function resetPassword()
{
    var email = document.getElementById("ResetEMail").value;
    var xmlhttp;
    if (window.XMLHttpRequest)xmlhttp=new XMLHttpRequest(); 
    else xmlhttp=new ActiveXObject('Microsoft.XMLHTTP');
    xmlhttp.onreadystatechange=function(){document.getElementById('LoginScreen').innerHTML=xmlhttp.responseText;}
    xmlhttp.open('GET','passwordReset.php?EMail='+email,true);
    xmlhttp.send();
}
function register()
{
    var firstname = document.getElementById("RegisterFirstName").value;
    var lastname = document.getElementById("RegisterLastName").value;
    var email = document.getElementById("RegisterEMail").value;
    var pword = document.getElementById("RegisterPWord").value;
    var xmlhttp;
    if (window.XMLHttpRequest)xmlhttp=new XMLHttpRequest(); 
    else xmlhttp=new ActiveXObject('Microsoft.XMLHTTP');
    xmlhttp.onreadystatechange=function(){document.getElementById('LoginScreen').innerHTML=xmlhttp.responseText;}
    xmlhttp.open('GET','register.php?FirstName='+firstname+'&LastName='+lastname+'&EMail='+email'&PWord='+pword,true);
    xmlhttp.send();
}
</script>


<div id="LoginScreen">
<h1>Welcome to ****.</h1><br>
<h2>Please login or register below:</h2><br>
<form action="javascript: login()" method="get">
    <ul>
        <li>
            <h3>Username:&nbsp;</h3><input type="email" id="LoginUName" name="LoginUName" placeholder="Email address" />
        </li>
        <li>
            <h3>Password:&nbsp;</h3><input type="password" id="LoginPWord" name="LoginPWord" placeholder="Password"/>
        </li>
    </ul>
    <input type="submit" value="Login"/>
</form>
<br><hr><br>
<form action="javascript: resetPassword()" method="get">
    <h2>Forgot your password?</h2><br>
    Email address:&nbsp;<input type="email" id="ResetEMail" name="ResetEMail" placeholder="Email address" />&nbsp;&nbsp;<input type="submit" value="Reset" />
</form>
<br><hr><br>
<form action="javascript: register()" method="get">
    <h2>Register new user:</h2><br>
    <ul>
        <li>
            <h3>First Name:&nbsp;</h3><input type="text" id="RegisterFirstName" name="RegisterFirstName" placeholder="First Name" />
        </li>
        <li>
            <h3>Last Name:&nbsp;</h3><input type="text" id="RegisterLastName" name="RegisterLastName" placeholder="Last Name" />
        </li>
        <li>
            <h3>Email:&nbsp;</h3><input type="email" id="RegisterEMail" name="RegisterEMail" placeholder="email address" />
        </li>
        <li>
            <h3>Password:&nbsp;</h3><input type="password" id="RegisterPWord" name="RegisterPWord" placeholder="Password" />
        </li>
    </ul>
    <input type="submit" value="Register"/>
</form>

Answer 1

It’s just a syntax error. You missed a + sign.

You have:

    xmlhttp.open('GET','register.php?FirstName='+firstname+'&LastName='+lastname+'&EMail='+email'&PWord='+pword,true);

It needs to have an + sign after email:

xmlhttp.open('GET','register.php?FirstName='+firstname+'&LastName='+lastname+'&EMail='+email+'&PWord='+pword,true);

That’s why it works if you put it in two separate scripts. One syntax error renders the whole script invalid.