Java Script is not checking the form

Question

That is the thing.

My head:

<script  language="JavaScript">
    function checkIt(){
        var pass = document.form1.value;  
        if (pass == "1234")  
            {  
                alert("Please input a Value");  
                return false;  
            }  
        else   
            {  
                alert('Code has accepted : you can try another');  
                return true;   
            }  
    } 
window.onload = checkIt();
</script>

My body:

<form action="#" method="post" id="form1" onsubmit="checkIt();">
    <input type="password" id="sn" name="sn" placeholder="Enter Your Password">
<img src="ok.gif" onclick="submit();" style="cursor: pointer;">
</form>

Can anybody tell me what I am doing wrong? It is not working. I need it to be able to compare entered value named sn, with var pass.

I am noob and not a native speaker, so stay calm, please:)

BrunoLM · Accepted Answer · 2013-06-04 16:48:21Z

1

Fix your script

// to get the input value
var pass = document.getElementById("sn").value;

And on your form you have to return the result of the function

onsubmit="return checkIt();"

Also remove window.onload = checkIt(); that will validate the form before you enter any value

edited Jun 4, 2013 at 16:48

answered Jun 4, 2013 at 16:43

BrunoLM

101k86 gold badges311 silver badges464 bronze badges

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

Comments

Amyth · Accepted Answer · 2013-06-04 16:59:10Z

0

try the following:

Javascript

<script  language="JavaScript">
    function checkIt(){
        var pass = document.getElementById("sn").value;  
        if (pass == "1234")  
            {  
                alert("Please input a Value");  
                return false;  
            }  
        else   
            {  
                alert('Code has accepted : you can try another');  
                return true;   
            }  
    } 
</script>

HTML

<form action="#" method="post" id="form1" onsubmit="return checkIt();">
    <input type="password" id="sn" name="sn" placeholder="Enter Your Password">
    <img src="ok.gif" onclick="document.getElementById("form1").submit();" style="cursor: pointer;">
</form>

answered Jun 4, 2013 at 16:59

Amyth

33k28 gold badges97 silver badges137 bronze badges

3 Comments

user2451963 Over a year ago

I've just changed the last line

user2451963 Over a year ago

epascarello Over a year ago

And if you do that, you do not need the click event! I explained everything in my post. Feel free to ignore it.

user2393979 · Accepted Answer · 2013-06-04 16:41:39Z

0

Try var pass = document.getElementById('sn').value;

answered Jun 4, 2013 at 16:41

user2393979

Comments

gtr1971 · Accepted Answer · 2013-06-04 16:48:40Z

0

onclick="form1.submit()" and onsubmit="return checkIt()"

answered Jun 4, 2013 at 16:48

gtr1971

2,7382 gold badges19 silver badges23 bronze badges

Comments

epascarello · Accepted Answer · 2013-06-04 17:12:00Z

0

You are calling the function, not assigning it

window.onload = checkIt();

Needs to be

window.onload = checkIt;

But do you really want to run the validation when the page loads? You probably do not need this line at all. Delete it!

You are not cancelling the submit event. Your function returns true or false, but you are not handling it.

<form action="#" method="post" id="form1" onsubmit="checkIt();">

Your form tag needs to be

<form action="#" method="post" id="form1" onsubmit="return checkIt();">

notice the return statement. That will cancel the submission.

What is submit()? The page is probably throwing an error which you would be able to see in the console. You need to tell it what to submit. That means referencing a form.

<img src="ok.gif" onclick="submit();" style="cursor: pointer;">

There is no method called submit() in your code. Maybe you want to call the form submission.

<img src="ok.gif" onclick="doucment.form1.submit();" style="cursor: pointer;">

You would probably be better off using input with type="image" to submit the form.

<input type="image" src="ok.gif" />

Using the input means no JavaScript is needed to submit the form. So remove the image tag and add the input element!

And finally you are reading the value of the form, not the input

var pass = document.form1.value;

You want the input!

var pass = document.form1.sn.value;

And it makes no sense why 1234 would fail, but all other things pass. Don't you have the logic wrong?

You need to learn how to debug, use the browser's console and learn to use console.log() to see the data. Set break points and walk through the code so you can inspect what is going on. JavaScript 101.

edited Jun 4, 2013 at 17:12

answered Jun 4, 2013 at 16:48

epascarello

208k20 gold badges206 silver badges246 bronze badges

2 Comments

epascarello Over a year ago

Learn to use debugging tools, you have tons of issues, you need to start with each little piece and work your way up. console.log() is your friend, use it.

epascarello Over a year ago

@user2451963 So my answer tells you everything that is wrong and how to fix it. You should learn why the one you selected as an answer works.

Collectives™ on Stack Overflow

Java Script is not checking the form

5 Answers 5

Comments

Javascript

HTML

3 Comments

Comments

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Javascript

HTML

3 Comments

Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related