onKeyUp not working? maybe it's bad ajax code?

StackOverflow https://stackoverflow.com/questions/7376210

  •  28-10-2019
  •  | 
  •  

Question

I am just learning AJAX, and the following HTML file is not working. Every time I release a key, firebug says "login is not a function". I can't figure out why this is. Any help is appreciated.

<html>
<head>
<title>Ajax</title>
<script type="text/javascript">
function makeAjax() {
    var ajax;
    try{
        ajax = new XMLHttpRequest();
    }
    catch (e) {
        try {
            ajax = new ActiveXObject("Msxml2.XMLHTTP");
        }
        catch (e) {
            try {
                ajax = new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch (e) {
                alert("Your browser is either OLD or BAD! UPDATE!");
                return false;
            }
        }
    }
    ajax.onreadystatechange = function() {
        if(ajax.readyState == 4 && ajax.status == 200) {
            document.getElementById("btag").innerHTML = ajax.responseText;
        }
    }
}
function login() {
    ajax.open("GET", "ajax.php", true);
    ajax.send(null); 
}
</script>
</head>
<body onLoad="makeAjax();">
<form name="login">
Username: <input type="text" onKeyUp="login();" />
<br /><br />
Password: <input type="password" onKeyUp="login();" />
<b id="btag"></b>
</form>
</body>
</html>
Was it helpful?

Solution

onKeyUp="login();" seems to be finding your form (also named login). Renaming the form to something different (e.g. login_form) works for me.

OTHER TIPS

Try using a different form name. You have a form named 'login' and a Javascript function called Login. I think firebug is confused between the two...

Also, put the Ajax variable outside the function, .i.e. 

var ajax;
function makeAjax() {

    try{
        ajax = new XMLHttpRequest();
    }
    catch (e) {
        try {
            ajax = new ActiveXObject("Msxml2.XMLHTTP");
        }
        catch (e) {
            try {
                ajax = new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch (e) {
                alert("Your browser is either OLD or BAD! UPDATE!");
                return false;
            }
        }
    }
    ajax.onreadystatechange = function() {
        if(ajax.readyState == 4 && ajax.status == 200) {
            document.getElementById("btag").innerHTML = ajax.responseText;
        }
    }
}
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top