CODEWITHSUNDEEP
phpjavascriptajax
Mico Francisco
Mico Francisco

Reputation: 83

Javascript doesn't work inside <head> or <body> tags

I tried putting this code:

<script>
    function myfunc()
    {
        var xmlhttp;

        if(window.XMLHttpRequest)
            xmlhttp = new XMLHttpRequest();
        else
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");

        xmlhttp.onreadystatechange=function()
        {
            if(xmlhttp.readyState==4 && xmlhttp.status==200)
                alert(xmlhttp.responseText);
            else
                alert("Something went wrong!");
        }

        var tbl = document.GetElementByID("tbl_users");
        var str="";

        var tid;
        var isActive;

        for(x=0; x=tbl.rows[x]; x++)
        {
            tid=0;
            isActive="true";

            if(tbl.cells[1].checked)
                tid=1;
            else
                tid=2;

            if(tbl.cells[6].checked)
                isActive="true";
            else
                isActive="false";

            str="uid="+tbl.cells[0].value+"&tid="+tid+"&firstName="tbl.cells[2].value+"&lastName="+tbl.cells[3].value+"&userName="+tbl.cells[4].value+"&passWord="+tbl.cells[5].value+"&isActive="+isActive;

            xmlhttp.open("POST", "save.php", true);
            xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
            xmlhttp.send(str);
        }
    }
</script>

...inside the tags of a web page I'm making, as I only followed some tutorials which shows the same. Here's the code for my HTML: Users

    <!--JS codes above here-->
</head>

<body>
    <form>
        <table align='center' border='1' name='tbl_users'>
            <tr>
                <td>UID</td>
                <td>Admin</td>
                <td>First Name</td>
                <td>Last Name</td>
                <td>Username</td>
                <td>Password</td>
                <td>Active</td>
            </tr>

            <?php
            while($row = mysql_fetch_array($table))
            {
                echo "
                    <tr>
                        <td><input type='text' name='uid' value='".$row['uid']."' disabled/></td>";
                        if($row['tid'] == 1)
                            echo "<td><input type='checkbox' name='tid' value='1' checked/></td>";
                        else
                            echo "<td><input type='checkbox' name='tid' value='2'/></td>";
                echo "  <td><input type='text' name='firstName' value='".$row['firstName']."' /></td>
                        <td><input type='text' name='lastName' value='".$row['lastName']."' /></td>
                        <td><input type='text' name='userName' value='".$row['userName']."' /></td>
                        <td><input type='text' name='passWord' value='".$row['passWord']."'/></td>";
                        if($row['isActive'] == 0)
                            echo "<td><input type='checkbox' name='isActive' value='true' checked/></td>";
                        else
                            echo "<td><input type='checkbox' name='isActive' value='false'/></td>";

                echo "</tr>";
            }?>

        <tr>
            <td colspan='7' align='right'><input type='button' value="Save" onclick='myfunc()'/></td>
        </tr>
        </table>
    </form>
</body>

Now, I've read possible solutions for that like: - putting it inside a $(document).ready() call - putting the JS code inside the tag, just below the closing tag

But still, it won't work.

I have tried simple JS codes like:

<script> function myfunc(){alert("hello world!");} </script>

...with the same solutions, and only the 2nd method worked for this.

Any idea?

Upvotes: 0

Views: 217

Answers (2)

Joshua Wilson
Joshua Wilson

Reputation: 2526

The for(x=0; x=tbl.rows[x]; x++) should be for(x=0; x<tbl.rows[x]; x++).

You need a comparison operator in the 2nd section.

Here is a clean up version. Remember you should always use curly braces on the end of your if lines because the JS compiler likes to insert ; otherwise.

function myfunc() {
    var xmlhttp;

    if (window.XMLHttpRequest) {
        xmlhttp = new XMLHttpRequest();
    } else {
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }

    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState === 4 && xmlhttp.status === 200) {
            alert(xmlhttp.responseText);
        } else {
            alert("Something went wrong!");
        }
    }

    var tbl = document.getElementById("tbl_users");
    var str = "";

    var tid;
    var isActive;

    for (x = 0; x < tbl.rows[x]; x++) {
        tid = 0;
        isActive = "true";

        if (tbl.cells[1].checked) {
            tid = 1;
        } else {
            tid = 2;
        }

        if (tbl.cells[6].checked) {
            isActive = "true";
        } else {
            isActive = "false";
        }

        str = "uid=" + tbl.cells[0].value + "&tid=" + tid + "&firstName=" 
                + tbl.cells[2].value + "&lastName=" + tbl.cells[3].value + "&userName="
                + tbl.cells[4].value + "&passWord=" + tbl.cells[5].value
                + "&isActive=" + isActive;

        xmlhttp.open("POST", "save.php", true);
        xmlhttp.setRequestHeader("Content-type",
                "application/x-www-form-urlencoded");
        xmlhttp.send(str);
    }
}

Upvotes: 1

T.J. Crowder
T.J. Crowder

Reputation: 1074989

I see at least two problems:

  1. JavaScript is case-sensitive, and var tbl = document.GetElementByID("tbl_users"); should be var tbl = document.getElementById("tbl_users"); (note the g and d in getElementById).

  2. In this line:

    str="uid="+tbl.cells[0].value+"&tid="+tid+"&firstName="tbl.cells[2].value+"&lastName="+tbl.cells[3].value+"&userName="+tbl.cells[4].value+"&passWord="+tbl.cells[5].value+"&isActive="+isActive;

    ...you're missing a + after "&firstName=" and before tbl.cells[2].value. Your console should be telling you that you have an Unexpected identifier.

Upvotes: 3

Related Questions