2010-01-14 3 views
0

jQuery 양식 플러그인을 사용하여 변경시 양식을 동적으로 제출하려고합니다.왜이 AJAX 제출 루프에 갇혀 있습니까?

확실히 작동하지만 사용자가 입력 값을 변경할 때마다 .post를 실행하고 내 경고 "alert()"를 실행 한 다음 페이지를 새로 고침하여 루프를 중지 할 때까지 반복하여 반복합니다. 코드는 다음과 같습니다.

<!DOCTYPE html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<title>AJAX Form Test Suite</title> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script> 
<script src="_scripts/jquery.form.js"></script> 
<script> 
    $(document).ready(function() { 
    var options = { 
     success:  alertYes // post-submit callback 
    }; 

    // binding to each input's change event 
    $('#mainForm input').change(function() { 

     $(this).parent().ajaxSubmit(options); 

     return false; 
    }); 

    //success callback function 
    function alertYes() {  
     alert('You did it!'); 
    } 
}); 
</script> 
</head> 

<body> 
<div id="ajaxMessage"> 
<h1>This is a suite AJAX form</h1> 
<form id="mainForm" action="saveForm.php" method="post"> 
    <ul class="nolist"> 
    <li class="label"><label>Name</label></li> 
    <li class="input"><input type="text" name="name" value="Eric Roberts" /></li> 
    <li class="label"><label>Email</label></li> 
    <li class="input"><input type="text" name="email" value="[email protected]" /></li> 
    <li class="label"><input type="submit" name="submit" value="DO IT" /></li> 
    </ul> 
</form> 
</div> 
</body> 
</html> 

계속 반복적으로 반복하도록하려면 어떻게해야합니까? 나는 그것이 .post가 경고를받은 후 반환 될 때 무언가라고 가정하고있다. 다시 말해서, ajax 호출을 다시 제출하는 입력을 계속해서 흐리게한다. 그러나 왜 그렇게 할 수 있을지 모르겠다.

감사합니다.

+0

추신 : 여기에 제가 사용하는 플러그인이 있습니다 : http://jquery.malsup.com/form/ – rhodesjason

답변

4

alert() 호출로 인해 양식의 blur() 이벤트가 트리거되어 양식이 다시 제출되는 것으로 보입니다.


갱신

당신이 방화범을 사용하는 경우, 당신은 다음과 같은 자바 스크립트를 사용할 수 있습니다

console.debug('my message goes here'); 

파이어 버그 콘솔에 메시지를 방출 할 수 있습니다./디버깅을 방출 내가 요구하는 메시지를 추적하는 내 자바 스크립트 내에서 ('여기 내 메시지 ...')

function status(msg) 
{ 
    if(console) 
    console.debug('# '+msg); 
    } 
} 

을 한 후 상태를 전화 : 나는 일반적으로 이런 전화에 포장. 위에서 한 것처럼 함수로 래핑하면 콘솔 객체 (IE 또는 Firebug가 설치되지 않은 브라우저)를 정의하지 않은 브라우저에서 코드를 실행해도 코드가 계속 작동하는지 확인할 수 있습니다.

+0

예, 그게 전부입니다. 나는 alert()가 blur()를 만든 것을 깨닫지 못했다. 나는 경고를 필요로하지 않고 그냥 테스트에 사용했기 때문에 쉽게 해결할 수 있습니다. 감사! – rhodesjason

1

대신 입력 할 때 .change 이벤트에 바인딩하도록 설득 할 수 있습니까? 아마도이 문제가 해결 될 것이며 불필요한 제출을 피할 수 있습니다. 지금 누군가가 폼의 탭을 누른 다음 (아무 것도 변경하지 않고) 양식에서 빠져 나오면 제출할 것입니다. 이는 무의미한 제출입니다. 어쨌든 당신이 찾고있는 것에 더 가까울 것입니다.

+0

고마워, 사실이야. 나는 .change가 각 변경 키 입력시 양식을 제출할 것을 염려 했었지 만, 그렇지 않은가요? – rhodesjason

+0

아니, 그게 열쇠 또는 ​​keydown 이벤트 것입니다. jQuery 워드 프로세서에서 : 컨트롤이 입력 포커스를 잃고 포커스를 얻은 후 값이 수정되면 change 이벤트가 발생합니다. – Parrots

+0

환상적. 다시 한번 감사드립니다. – rhodesjason