I'm new to JavaScript. I need to prevent the form from submitting if any of the validation conditions returned false.
ex:-
if((document.getElementById("name").value)==""){
alert("'Name' field can not be empty");
return false;
}
I tried <form onsubmit="return validate();"> and <form onsubmit="event.preventDefault(); validate();">. None of those helped. First one prompt the same alert message twice. Second one continuously prompt all alert messages. What I want is,
Is there any way to accomplish this by using JavaScript (No JavaScript libraries)?
Sorry if there are any grammar mistakes, English is not my first language :(
You need to call preventDefault of the event object that comes as a parameter you get from the callback function of the EventListener. Like that:
...
<head>
<script>
window.addEventListener("load",init);
function init()
{document.getElementById("form").addEventListener("submit",function(e)
{e.preventDefault();});}
</script>
</head>
<body>
<form id="form">
<input type="submit">
</form>
</body>
...
You can call that parameter anything, and you can also define that function somewhere else.
...
<script>
window.addEventListener("load",init);
function init()
{document.getElementById("form").addEventListener("submit",handleSubmit);}
function handleSubmit(event)
{event.preventDefault();}
</script>
...