Javascript onsubmit causing page to refresh

Really simple form

<form id="addDonor" name="addDonor" onsubmit="addDonor(); return false;" action="" method="post" enctype="multipart/form-data">
<div class="sectionHeader">Add New Donor</div>
<div class="formRow"><label>Name</label> <input class="inputText fullTextBar" type="text" name="userName">
<div class="formRow"><button style="margin-left:350开发者_如何学编程px; width: 80px" type="button" class="publish">Add Donor</button></div>
</form>

And the addDonor function

<script type="text/javascript">

function addDonor(){    
    alert("test");
    return false;
}
</script>

Eventually that function will include some jquery ajax to submit the info. But, baby, steps. Right now I can't even get the alert to show up. Also, when I hit "Enter" on my keyboard, the whole page refreshes, when I press "Add Donor" nothing happens.

I'm sure it has to be a simple problem. I think it's one of those things that I just need someone else's eyes to point out.

Try assigning the onsubmit event in javascript:

document.getElementById("addDonor").onsubmit = function () {
    alert("test");
    return false;
}

The problem is that your function is named addDonor and your element is addDonor. Every element with an id has an object created under document to identify it. Try alert(addDonor) in the inline onsubmit to see that it alerts an HTML element, not a function. Inline functions execute in a scope chain inside document, so addDonor points to document.addDonor before it reaches window.addDonor (your function).

you should change your <button> to an <input type="submit"> (as @fireshadow52 suggested) that should fix your problem. you should try the Wc3 Schools online javascript tester to try out simple javascripts before you put it in a page, or any other one that you prefer. google has something along these lines. also, you can normally try the javascript console on your respective browser.

Your button is explicitly set to type="button", which won't make it submit the form. Change it to <button type="submit">, or to <input type="submit"> if you prefer (I like the styling options of <button> myself).