jQuery를 사용하여 일련의 프로세스가 전달되는 경우에만 양식을 제출하도록 연기합니다.

Question

먼저, 지연 파이프 API를 보류하는 것이 최근에 저에게 가장 힘든 일이었습니다.

요구 사항

나는 일련의 검사를 통과하면 양식을 제출하고 싶습니다.

• 일부는 동기 클라이언트 측 유효성 검사가있는 기능이며 일부는 AJAX 호출을 수행하는 비동기 검사입니다. 비동기 함수는 부울 콜백 값을 반환합니다.

• 동기식 기능과 비동기식 기능 모두 confirm() 사용자 입력을 요구할 수 있습니다. 사용자 입력은 다음 블록의 실행 여부를 결정합니다 (사용자가 확인 대화 상자에서 취소하면 다음 블록이 진행되지 않아야하므로). 양식이 제출되지 않아야합니다. 이것은 매우 중요합니다.

• 모든 개별 블록이 반환 (또는 콜백) 된 경우에만 양식을 제출해야합니다.

나중에 추가 - 비동기 함수는 따라서 일부 사용의 경우, AJAX 호출이 수행되지 않을 수 있습니다, 일부 조건 내부의 아약스 호출을 포함 할 수있다.

• 비동기 함수 내부에는 AJAX 응답 처리 코드 안에 사용자 확인 확인이있을 수 있습니다. 다음
는

내 기능의 구조입니다 -

function synchronousMethod() 
{ 
    //some logic 
    return (confirm("user input")); 
} 

function aSynchronousMethod1(callback) 
{ 

    if(condition) 
    { 
     //ajax call 
     callback(bool); //does callback true/false 
    } 
    else 
    {//some use cases may follow this path and not make the AJAX call at all. 
     return true; 
    } 
} 

에 따라 $ .Deferred 내 시험 중 하나입니다 (내가 완전히 잘못을하고있는 중이 될 수 있습니다) -

$.when(synchronousMethod(), aSynchronousMethod1(),aSynchronousMethod2()) 
.done(function() { 
    //I want to submit my form if all the functions returned/called-back true 
    console.log("submitting form"); 
}) 
.fail(function() { 
    console.log('I fire if one or more requests failed.'); 
}); 

그러나 "submititting form"텍스트는 비동기 함수 완료 전에 실행되며 임의의 함수도이 오류를 발생시킵니다 TypeError: callback is not a function.

$.when(synchronousMethod, aSynchronousMethod1,aSynchronousMethod2) 을하지만 기능 중 어느 것도 실행되지 -

나는 함수의 $.when 내부 즉, 호출 후 나는 이런 식으로 계속하면 내가 괄호를 넣어하지 않는 경우 기능 중 어느 것도 실행되지 것을 관찰했다.

업데이트

나는 또한이 같은 시도했지만 첫 번째 방법과 마찬가지로 비슷한 문제가 있었다

또 다른 방법 -

var promise = defer.pipe(synchronousMethod); 
promise = promise.pipe(aSynchronousMethod1); 
promise = promise.pipe(aSynchronousMethod2); 
promise = promise.pipe($("form#frmCampaigns").submit()); 

업데이트 2 추가 된 두 더 많은 포인트 -

• 비동기 함수는 일부 조건에서 ajax 호출을 포함 할 수 있으므로 일부 경우에는 ajax 호출이 수행되지 않을 수 있습니다.

• 비동기 함수 내부에는 AJAX 응답 처리 코드 안에 사용자 확인 확인이있을 수 있습니다. 비동기 기능의

업데이트 구조 - 나는 completly 귀하의 예제를 이해한다면

function aSynchronousMethod1(callback) 
{ 
     //some sync logic here 
    if(condition) /*some condition*/ 
    { 
     //ajax call 
     if(ajax sucess response) 
     { 
      callback((confirm("If user accepts")); 
     } 
     else 
     { 
     callback(false); 
     } 
    } 
    else 
    {//some use cases may follow this path and not make the AJAX call at all. 
     callback(true); 
    } 
} 

Answer 1

는 잘 모르겠어요. 하지만 비동기 방식은 ($ 아약스의 반환 값과 같은) 약속을 반환해야 함을, 문제가있을 것 같아요 : http://jsfiddle.net/CcsQz/

업데이트

:

여기

function sync() { 
    return "something"; 
} 

function async1() { 
    return $.ajax("http://www.foo.com"); 
} 

function async2() { 
    return $.ajax("http://www.bar.com"); 
} 

$.when(sync(), async1(), async2()).done(function() { 
    console.log("success"); 
}).fail(function() { 
    console.log("error"); 
}); 

가 작동 예입니다

알았어. 어쩌면 당신은 귀하의 경우이 같은 작업을 수행 할 수 있습니다

function syncOrAsync(sync, confirm) { 

    var deferred = jQuery.Deferred() 

    if (sync) { 
     deferred.resolve(); 
    } else { 
     $.ajax('http://www.foo.com').done(function(data) { 
      if (confirm(data)) { 
       deferred.resolve(); 
      } else { 
       deferred.reject(); 
      } 
     }).fail(function() { 
      deferred.reject(); 
     }); 
    } 

    return deferred.promise(); 
} 

var confirm = function(data) { 
    // check confirmation here 

    return true; 
} 

var method1 = syncOrAsync(true, confirm); 
var method2 = syncOrAsync(false, confirm); 

$.when(method1, method2).done(function() { 
    console.log('done'); 
}).fail(function() { 
    console.log('fail'); 
}); 

업데이트 바이올린 : http://jsfiddle.net/mKdwN/