Een manier om het indienen van formulieren te stoppen, is door false te retourneren vanuit uw JavaScript-functie.
Wanneer op de verzendknop wordt geklikt, wordt een validatiefunctie aangeroepen. Ik heb een geval in vormvalidatie. Als aan die voorwaarde is voldaan, roep ik een functie aan met de naam returnToPreviousPage();
function returnToPreviousPage() {
window.history.back();
}
Ik gebruik JavaScript en Dojo Toolkit.
In plaats van terug te gaan naar de vorige pagina, verzendt het het formulier. Hoe kan ik deze inzending afbreken en terugkeren naar de vorige pagina?
Antwoord 1, autoriteit 100%
U kunt de retourwaarde van de functie gebruiken om het verzenden van het formulier te voorkomen
<form name="myForm" onsubmit="return validateMyForm();">
en functioneren als
<script type="text/javascript">
function validateMyForm()
{
if(check if your conditions are not satisfying)
{
alert("validation failed false");
returnToPreviousPage();
return false;
}
alert("validations passed");
return true;
}
</script>
In het geval van Chrome 27.0.1453.116 m als bovenstaande code niet werkt, set het veld returnValuevan de parameter van de gebeurtenishandler in op false om het te laten werken.
Bedankt Sam voor het delen van informatie.
BEWERK:
Bedankt aan Vikram voor zijn tijdelijke oplossing voor als ValidMyForm() false retourneert:
<form onsubmit="event.preventDefault(); validateMyForm();">
waarin ValidMyForm() een functie is die false retourneert als de validatie mislukt. Het belangrijkste punt is om de naam gebeurtenis te gebruiken. We kunnen niet gebruiken voor b.v. e.preventDefault()
Antwoord 2, autoriteit 39%
Gebruik standaard voorkomen
Dojo-toolkit
dojo.connect(form, "onsubmit", function(evt) {
evt.preventDefault();
window.history.back();
});
jQuery
$('#form').submit(function (evt) {
evt.preventDefault();
window.history.back();
});
Vanille JavaScript
if (element.addEventListener) {
element.addEventListener("submit", function(evt) {
evt.preventDefault();
window.history.back();
}, true);
}
else {
element.attachEvent('onsubmit', function(evt){
evt.preventDefault();
window.history.back();
});
}
Antwoord 3, autoriteit 15%
Het volgende werkt vanaf nu (getest in Chrome en Firefox):
<form onsubmit="event.preventDefault(); validateMyForm();">
Waarbij ValidMyForm() een functie is die falseretourneert als de validatie mislukt. Het belangrijkste punt is om de naam eventte gebruiken. We kunnen niet gebruiken voor b.v. e.preventDefault().
Antwoord 4, autoriteit 5%
Gebruik gewoon een simpele buttonin plaats van een verzendknop. En roep een JavaScript-functie aan om formulierverzending af te handelen:
<input type="button" name="submit" value="submit" onclick="submit_form();"/>
functie binnen een scripttag:
function submit_form() {
if (conditions) {
document.forms['myform'].submit();
}
else {
returnToPreviousPage();
}
}
U kunt ook window.history.forward(-1);
5, Autoriteit 3%
basis op @vikram Pudi Antwoord, we kunnen dit ook doen met Pure Javascript
<form onsubmit="submitForm(event)">
<input type="text">
<input type="submit">
</form>
<script type="text/javascript">
function submitForm(event){
event.preventDefault();
}
</script>
6, Autoriteit 3%
Veel harde manieren om een gemakkelijke ding te doen:
<form name="foo" onsubmit="return false">
7, Autoriteit 2%
Al uw antwoorden gaven iets om mee te werken.
Ten slotte werkte dit voor mij: (Als u niet kiest voor ten minste één selectievakje Item, waarschuwt en blijft en blijft op dezelfde pagina)
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<form name="helloForm" action="HelloWorld" method="GET" onsubmit="valthisform();">
<br>
<br><b> MY LIKES </b>
<br>
First Name: <input type="text" name="first_name" required>
<br />
Last Name: <input type="text" name="last_name" required />
<br>
<input type="radio" name="modifyValues" value="uppercase" required="required">Convert to uppercase <br>
<input type="radio" name="modifyValues" value="lowercase" required="required">Convert to lowercase <br>
<input type="radio" name="modifyValues" value="asis" required="required" checked="checked">Do not convert <br>
<br>
<input type="checkbox" name="c1" value="maths" /> Maths
<input type="checkbox" name="c1" value="physics" /> Physics
<input type="checkbox" name="c1" value="chemistry" /> Chemistry
<br>
<button onclick="submit">Submit</button>
<!-- input type="submit" value="submit" / -->
<script>
<!---
function valthisform() {
var checkboxs=document.getElementsByName("c1");
var okay=false;
for(var i=0,l=checkboxs.length;i<l;i++) {
if(checkboxs[i].checked) {
okay=true;
break;
}
}
if (!okay) {
alert("Please check a checkbox");
event.preventDefault();
} else {
}
}
-->
</script>
</form>
</body>
</html>
Antwoord 8
Ik raad aan om onsubmitniet te gebruiken en in plaats daarvan een gebeurtenis aan het script toe te voegen.
var submit = document.getElementById("submitButtonId");
if (submit.addEventListener) {
submit.addEventListener("click", returnToPreviousPage);
} else {
submit.attachEvent("onclick", returnToPreviousPage);
}
Gebruik vervolgens preventDefault()(of returnValue = falsevoor oudere browsers).
function returnToPreviousPage (e) {
e = e || window.event;
// validation code
// if invalid
if (e.preventDefault) {
e.preventDefault();
} else {
e.returnValue = false;
}
}
9
Bijv als je submit knop op formulier, inorder om te stoppen met haar propogation gewoon schrijven event.preventDefault (); in de functie die wordt opgeroepen op Submit knop of enter-toets.
10
De antwoorden van Hemant en Vikram waren niet helemaal voor mij, regelrecht in Chrome. Het evenement.preventdefault (); Script verhinderde de pagina van het indienen, ongeacht het passeren of falen van de validatie. In plaats daarvan moest ik het evenement bewegen.Preventdefault (); in de IF-verklaring als volgt:
if(check if your conditions are not satisfying)
{
event.preventDefault();
alert("validation failed false");
returnToPreviousPage();
return false;
}
alert("validations passed");
return true;
}
Dank aan Hemant en Vikram voor het plaatsen van mij op de goede weg.