양식 제출을 중지하는 JavaScript 코드
양식 제출을 중지하는 한 가지 방법은 JavaScript 함수에서 false를 반환하는 것입니다.
제출 단추를 클릭하면 유효성 검증 기능이 호출됩니다. 양식 유효성 검사에 대한 사례가 있습니다. 해당 조건이 충족되면 returnToPreviousPage () 라는 함수를 호출합니다 .
function returnToPreviousPage() {
window.history.back();
}
JavaScript와 Dojo Toolkit을 사용하고 있습니다.
이전 페이지로 돌아가서 양식을 제출합니다. 이 제출을 중단하고 이전 페이지로 돌아가려면 어떻게해야합니까?
함수의 반환 값을 사용하여 양식 제출을 막을 수 있습니다
<form name="myForm" onsubmit="return validateMyForm();">
그리고 같은 기능
<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>
Chrome 27.0.1453.116 m의 경우 위의 코드가 작동하지 않으면 이벤트 핸들러의 매개 변수 returnValue 필드를 false로 설정하여 작동 시키십시오.
정보를 공유해 주셔서 감사합니다.
편집하다 :
validateMyForm ()이 false를 반환하는 경우 해결 방법에 대한 Vikram에게 감사합니다.
<form onsubmit="event.preventDefault(); validateMyForm();">
여기서 validateMyForm ()은 유효성 검사에 실패하면 false를 반환하는 함수입니다. 요점은 이름 이벤트를 사용하는 것입니다. egepreventDefault ()에는 사용할 수 없습니다
예방 기본 사용
Dojo 툴킷
dojo.connect(form, "onsubmit", function(evt) {
evt.preventDefault();
window.history.back();
});
jQuery
$('#form').submit(function (evt) {
evt.preventDefault();
window.history.back();
});
바닐라 자바 스크립트
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();
});
}
다음은 현재 작동합니다 (Chrome 및 Firefox에서 테스트).
<form onsubmit="event.preventDefault(); validateMyForm();">
여기서 validateMyForm ()은 false유효성 검사에 실패하면 반환되는 함수입니다 . 핵심은 name을 사용하는 것 event입니다. 예를 들어 사용할 수 없습니다 e.preventDefault().
button제출 버튼 대신 간단한 것을 사용하십시오 . 그리고 양식 제출을 처리하기 위해 JavaScript 함수를 호출하십시오.
<input type="button" name="submit" value="submit" onclick="submit_form();"/>
script태그 내 기능 :
function submit_form() {
if (conditions) {
document.forms['myform'].submit();
}
else {
returnToPreviousPage();
}
}
시도해 볼 수도 있습니다 window.history.forward(-1);
모든 대답은 함께 할 일을주었습니다.
FINALLY, this worked for me: (if you dont choose at least one checkbox item, it warns and stays in the same page)
<!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>
Lots of hard ways to do an easy thing:
<form name="foo" onsubmit="return false">
I would recommend not using onsubmit and instead attaching an event in the script.
var submit = document.getElementById("submitButtonId");
if (submit.addEventListener) {
submit.addEventListener("click", returnToPreviousPage);
} else {
submit.attachEvent("onclick", returnToPreviousPage);
}
Then use preventDefault() (or returnValue = false for older browsers).
function returnToPreviousPage (e) {
e = e || window.event;
// validation code
// if invalid
if (e.preventDefault) {
e.preventDefault();
} else {
e.returnValue = false;
}
}
Hemant and Vikram's answers didn't quite work for me outright in Chrome. The event.preventDefault(); script prevented the the page from submitting regardless of passing or failing the validation. Instead, I had to move the event.preventDefault(); into the if statement as follows:
if(check if your conditions are not satisfying)
{
event.preventDefault();
alert("validation failed false");
returnToPreviousPage();
return false;
}
alert("validations passed");
return true;
}
Thanks to Hemant and Vikram for putting me on the right track.
Lets say you have a form similar to this
<form action="membersDeleteAllData.html" method="post">
<button type="submit" id="btnLoad" onclick="confirmAction(event);">ERASE ALL DATA</button>
</form>
Here is the javascript for the confirmAction function
<script type="text/javascript">
function confirmAction(e)
{
var confirmation = confirm("Are you sure about this ?") ;
if (!confirmation)
{
e.preventDefault() ;
returnToPreviousPage();
}
return confirmation ;
}
</script>
This one works on Firefox, Chrome, Internet Explorer(edge), Safari, etc.
If that is not the case let me know
E.g if you have submit button on form ,inorder to stop its propogation simply write event.preventDefault(); in the function which is called upon clicking submit button or enter button.
Simply do it....
<form>
<!-- Your Input Elements -->
</form>
and here goes your JQuery
$(document).on('submit', 'form', function(e){
e.preventDefault();
//your code goes here
//100% works
return;
});
참고URL : https://stackoverflow.com/questions/8664486/javascript-code-to-stop-form-submission
'IT' 카테고리의 다른 글
| 람다를 함수 포인터로 전달 (0) | 2020.05.20 |
|---|---|
| Python에 None이 없으면 기본값을 반환하는 속기가 있습니까? (0) | 2020.05.19 |
| 런타임시 jQuery를 사용하여 CSS 규칙 / 클래스 만들기 (0) | 2020.05.19 |
| WPF 사용자 컨트롤 부모 (0) | 2020.05.19 |
| Python을 사용하여 CSV 파일을 편집 할 때 헤더를 건너 뜁니다 (0) | 2020.05.19 |