Menu
My onsubmit is not working. My idea was to put some mandatory fields and, in order to achieve that, I was using the onsubmit method inside a form in HTML that called a JavaScript function.
The idea was if all the mandatory fields were filled, the javascript function would return true and it would move on to page /control/Cadastro.php. Otherwise, if any mandatory field was empty, it would return false and it wouldn't move to page /control/Cadastro.php, staying in the current page until true.
Unfortunately, the function does return false if all the mandatory fields are not filled, as expected, but it still moves to page /control/Cadastro.php, even if it shouldn't.
I'm going to cut off some code to make my point of view perceptible.
<!DOCTYPE html>
<html>
<head>
<script>
function ValidateRequiredFields()
{
var message = new String('\nCampos obrigatórios:\n');
var flag=new Boolean(1);
var x=document.forms["theForm"]["nr_processoCA"].value;
if (x==null || x==""){
message += '\nNº do processo\n';
flag = new Boolean(0);
}
if (flag == false){
alert(message);
}
return flag;
}
</script>
</head>
<body>
<form name="theForm" onsubmit="return ValidateRequiredFields()" method="post" action="../control/Cadastro.php">
Nº do Processo: <br>
<input type="text" name="nr_processoCA" class="input-xlarge">
<br>
<div class="row-fluid" style="text-align:center;">
<input type="submit" class="btn btn-primary btn-large" value="Gravar">
</div>
</form>
</body>
</html>
917
The simplest solution to prevent the form submission is to return false on submit event handler defined using the onsubmit property in the HTML <form> element.
Use the return value of the function to stop the execution of a form in JavaScript. False would return if the form fails to submit.
The preventDefault() method cancels the event if it is cancelable, meaning that the default action that belongs to the event will not occur. For example, this can be useful when: Clicking on a "Submit" button, prevent it from submitting a form.
Use the preventDefault() method on the event object to prevent a page refresh on form submit in React, e.g. event. preventDefault() . The preventDefault method prevents the browser from issuing the default action which in the case of a form submission is to refresh the page.
You should use preventDefault inside your onsubmit function. I modified your code:
function ValidateRequiredFields()
{
var message = new String('\nCampos obrigatórios:\n');
var flag=new Boolean(1);
var x=document.forms["theForm"]["nr_processoCA"].value;
if (x==null || x==""){
message += '\nNº do processo\n';
flag = new Boolean(0);
}
if (flag == false){
if(event.preventDefault){
event.preventDefault();
}else{
event.returnValue = false; // for IE as dont support preventDefault;
}
alert(message);
}
return flag;
}
DEMO
90
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
