제출하기 전에 ajax 스크립트를 실행하십시오.

Question

Good Day.

양식을 제출하기 전에 ajax 호출을 실행하는 데 문제가 있습니다. 난 그냥 초보자 웹 개발자 그래서 나와 함께 참아주세요.

내 코드는 다음과 같다 :

$(function() { 
$('#formname').submit(function() { 
    $.post('validation.php', $(this).serialize(), function(data) { 
    if(data == 'something') return true; 
    else return false; 
    }); 
} 
}); 

이 코드는 나를 위해 작동하지 않습니다. 코드가 잘못되었거나이를 달성 할 수있는 다른 방법이 있습니까? 사전에

덕분에,

Answer 1

당신은 제출 버튼을 클릭 이벤트를 정의 할 수 있습니다. 그런 다음 클릭하면 먼저 게시물을 작성한 다음 양식을 제출하십시오.

HTML :

<form id="target" action="destination.html"> 
    <input type="text" value="Hello there" /> 
    <input type="submit" value="Go" /> 
</form> 
<div id="other"> 
    Trigger the handler 
</div> 

JS :

$('#other').click(function() { 

    $.post('validation.php', $('#target').serialize(), function(data) { 
    if(data == 'something') { 
     $('#target').submit(); 
    } 
    }); 
}); 

Answer 2

당신은하지 AJAX 콜백 내부 제출 핸들러에서 return false;해야합니다. 그러나 매개 변수 e을 수락 한 다음 AJAX 호출을 수행하기 전에 e.preventDefault();을 호출하도록 함수를 변경하는 것이 좋습니다. 유효성 검사에 성공하면 $('#formname')[0].submit();을 사용하여 제출 처리자를 다시 호출하지 않고 양식을 실제로 제출하십시오.

PS : 우수 jQuery form plugin 및 validation plugin과 같은 플러그인을 사용하는 것이 더 좋습니다.

Answer 3

이 작업을 수행 할 수는 있지만 매우 못 생기고 실제로 원하지 않습니다.

$(function() { 
$('#formname').submit(function() { 
    var returnValue; 
    $.post({ 
    async: false, // This makes it possible 
    url: 'validation.php', 
    data: $(this).serialize(), 
    success: function(data) { 
     if(data == 'something') returnValue = true; 
     else returnValue = false; 
    } 
    }); 
    return returnValue; 
} 
}); 

하지만 왜 이것을 원하니? 다른 Ajax 함수를 수행하고 준비 할 수 있기 때문입니다. 그리고 아약스 요청을 마치면 document.location= "newlocation.html"을 할 수 있습니다. 이제는 아약스 요청이 완료 될 때까지 애플리케이션이 대기하기 때문입니다. 아약스 요청에 10 초가 소요될 경우 사람들은 10 초 동안 페이지를 사용할 수 없습니다.

항상 return false 인 경우 양식을 처리 할 Ajax 요청을 수행하십시오. 그리고 당신은 document.location을 수행하는 것이 더 나은 선택이 될 것입니다. 따라서 응용 프로그램이 멈추지 않습니다.