양식 제출시 모달 표시 (유효성 확인 전)

Question

(https://github.com/1000hz/bootstrap-validator/blob/master/js/validator.js)의 부트 스트랩 유효성 검사기를 사용하고 있으며 양식에서 제출 버튼을 누르면 즉시 모달 '로드 중'상자를 표시하려고합니다. . 나는 다음을 수행하여이를 달성했습니다

$('form').on('submit', function (event) { 
    showLoadingModal(); 
    if (!event.isDefaultPrevented()) { 
     event.preventDefault(); 
     submitForm(this); 
    } else { 
     hideLoadingModal(); 
    } 
}); 

I 버튼과 모달을 클릭 사이 (두 번째에서) 시간의 작은 격차가 문제납니다 그러나이 표시된다. 이 지연은 시간이 많이 걸리는 양식의 모든 필드의 유효성 검사로 인해 발생했다고 가정합니다.

이 때문에 발리 내 코드 이전에 실행되고있는 '양식 제출'믿고 날 리드하고 나는 showLoadingModal()

편집 호출 뭔가 다른 일을해야한다 :

내가 추가 한을 일부는 js에 로그인하여 어떤 일이 언제 일어나는지를 알아냅니다. 또한 showLoadingModal()을 '버튼 클릭'이벤트로 이동하여 양식 제출 전에 발생하는지 확인했습니다. 여기 내 메시지가 표시 얻을 순서는 다음과 같습니다 버튼을 클릭

전에 쇼 모달
후 양식을

< --Modal을 확인하려고 지금 나타납니다 제출
쇼 모달 ->

Answer 1

세트 A를 양식을 제출하기 전에 300ms의 지연이 발생합니다.

var event; 
var formobj; 
('form').on('submit', function (event) { 
showLoadingModal(); 
event = event; //save event to be used later 
formobj = this; 
setTimeout(function() 
{ 
    if (!event.isDefaultPrevented()) { 
     event.preventDefault(); 
     submitForm(formobj); 
     } else { 
      hideLoadingModal(); 
     } 
},300); 
return false; //Prevent normal submission of the form so that the dialog box is visible 
}); 

나는 ubmitForm (이)은 양식 게시를 수행하여 페이지가 다시로드되는 기능입니다.

그냥 도움이 되었기를 바랍니다.