JavaScript function not executing?

Question

I am very new to JavaScript and web development in general. I have a problem when I want to have my log in system executes a JavaScript function when the user submits but it does nothing when it should print to the screen. I can't figure out exactly what I am missing. Any help will be greatly appreciated!

<form name="sign_in" onsubmit="check_stuff()">
    <b>Username...</b>
    <br>
    <input type="text" name="Username" value="Your Username">
    <br>
    <br>
    <b>Password...</b>
    <br>
    <input type="text" name="Password" value="Your Password">
    <br>
    <br>
    <input type="submit" value="Submit">
</form>
<script>
function check_stuff(){
    document.write("gametime");
}
</script>

I want to note this overwrites the DOM. But I can't replicate your problem. It seems to write gametime on the screen. Note it does indeed do this, but the page is reloaded (depending on your broswer). — Spencer Wieczorek
– Spencer Wieczorek, Commented Nov 12, 2014 at 2:20

Guffa · Accepted Answer · 2014-11-12 02:23:57Z

1

The function is writing to the document, but that will just be visible for a very short time while the page reloads. The form will still be posted, so the page will reload and replace what you have written.

You would want to return the result from the function in the event handler:

onsubmit="return check_stuff()"

That will allow you to return false from the function if you want to keep the form to be posted:

function check_stuff(){
  document.write("gametime");
  return false;
}

(I assume that you are just using the document.write for testing purposes, as it will replace the entire current page with what you write.)

answered Nov 12, 2014 at 2:23

Guffa

703k111 gold badges760 silver badges1k bronze badges

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

Comments

Spencer Wieczorek · Accepted Answer · 2014-11-12 02:23:44Z

1

This works fine. Although it overwrites the DOM because document.write is called after it loaded. This means only gametime will be on the screen afterwards. It does show but, but submitting a form reloads the page. So it will appear as nothing happened.

To fix this you will want to return false; in which will not submit the form. Also change onsubmit="check_stuff()" to onsubmit="return check_stuff()".

answered Nov 12, 2014 at 2:23

Spencer Wieczorek

21.7k7 gold badges46 silver badges57 bronze badges

Comments

ianaya89 · Accepted Answer · 2014-11-12 02:25:34Z

1

It works ok for me, I think the issue you have is that te page is reloading after submit. Just add a return false; after the check_stuff() call to avoid the reload.

<form name="sign_in" onsubmit="check_stuff(); return false;">

Check out this codepen.

answered Nov 12, 2014 at 2:25

ianaya89

4,2613 gold badges29 silver badges34 bronze badges

Comments

huwence · Accepted Answer · 2014-11-12 02:26:21Z

1

if you want current page not be redirected, you should submit your form to a iframe in current page, like this:

<form name="sign_in" onsubmit="check_stuff()" target="#frame">
    <b>Username...</b>
    <br>
    <input type="text" name="Username" value="Your Username">
    <br>
    <br>
    <b>Password...</b>
    <br>
    <input type="text" name="Password" value="Your Password">
    <br>
    <br>
    <input type="submit" value="Submit">
</form>
        <iframe id="frame" name="frame"></iframe>
<script>
function check_stuff(){
    document.write("gametime");
}
</script>

answered Nov 12, 2014 at 2:26

huwence

3261 silver badge8 bronze badges

1 Comment

ianaya89 Over a year ago

I think is not a good practice do that. You could implement an easy solution returning false.

Collectives™ on Stack Overflow

JavaScript function not executing?

4 Answers 4

Comments

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related