HTML and Javascript. Why does my code not work

Question

This is a quite simple piece of HTML with a bit of JavaScript integrated. I did what I could from what I know, but I don't think I used the correct document tags. Its either that or the page needs a way of updating, which I don't know how to do. Please help.

<!DOCTYPE html>
<html>
<body>
    <form action="">
        User name:<br>
        <input type="text" name="userid">
        <br>
        User password:<br>
        <input type="password" name="psw">
    </form>

    <p>The characters in a password field are masked (shown as asterisks or circles).</p>

    <p id="enter"></p>

    <script>
        function access(username, password) {
            if (username == "bobby") {
                if (password == "qwertyasd123") {
                    document.getElementById(enter).innerHTML = "You may pass";
                }
            }
        }
        access(document.getElementsByName("userid").innerHTML, 
            document.getElementsByName("userid").innerHTML)
    </script>
</body>
</html>

Why are you calling the function of page load , I think you want to call the access function on some event — bugwheels94
– bugwheels94, Commented Dec 5, 2015 at 20:30
You will want to name your form and use document.forms[formname].userid.value, (and .psw.value), and you'll also want to keep the username and password secret - use a server side script (Bash, Perl, PHP, Python, JavaScript) or program (C, Java, C#,...). — Kenney
– Kenney, Commented Dec 5, 2015 at 20:34
Please edit your question to include what your code currently does, what errors it produces if any, and what the desired behavior is. For more information please read How To Ask. Thanks! — Maximillian Laumeister
– Maximillian Laumeister, Commented Dec 5, 2015 at 20:43

Mex · Accepted Answer · 2015-12-05 20:31:54Z

2

Change

document.getElementById(enter)

to

document.getElementById('enter')

Also change:

document.getElementsByName("userid").innerHTML

to

document.getElementsByName("userid")[0].value

And you didn't change userid to psw for one your strings.

answered Dec 5, 2015 at 20:31

Mex

9997 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

CoderPi · Accepted Answer · 2015-12-05 20:46:48Z

0

there where quite some mistakes indeed:

of document.getElementsByName("userid") you get an list, so you want to access the first by [0]:

document.getElementsByName("userid")

You forgot to use the id as a string here: document.getElementById(enter) should be document.getElementById("enter")

You used "userid" twice and not "psw" aswell:

access(document.getElementsByName("userid")[0].value, 
            document.getElementsByName("psw")[0].value)

You want it to happen when you press enter:

<form onsubmit='access(document.getElementsByName("userid")[0].value, document.getElementsByName("psw")[0].value)'>

and you will need a <input type="submit" name="sub"> for that aswell.

Here is the complete code and the working example: https://jsfiddle.net/j35fbet9/

answered Dec 5, 2015 at 20:46

CoderPi

13.2k4 gold badges38 silver badges64 bronze badges

1 Comment

Huzaifah Farooq Over a year ago

Thanks all. I understand the issues now. Very basic errors from me, although I am fairly weak at coding myself.

Collectives™ on Stack Overflow

HTML and Javascript. Why does my code not work

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related