2014-11-25 2 views
0

사용자가 기부 할 금액을 입력해야하는 양식이 있습니다. 제출을 클릭하면 함수가 호출되며 함수는 지정된 양을 표시하고 입력 된 금액이 실제 금액인지 여부를 확인하도록 사용자에게 프롬프트합니다.자바 스크립트에서 양식을 제출하는 확인 기능 취소

Confirm()의 Cancel 옵션은 false를 반환하는 대신 폼을 계속 전송합니다.

Jsfiddle link

function donationFormSend(){ 

    get_donation_amount = document.getElementById("get_donation_amt").value; 

    if(get_donation_amount != ''){ 
     return confirm("You have specified "+get_donation_amount+" as the amount you wish to donate. \n\n Are you sure you want to proceed with the donation?"); 
    } 
    else{ 
     alert("Amount must be specified to process your donation."); 
     return false; 
    } 

}  


<form method="post" action=""> 
<div> 
     <div>Donation Amount:</div> 
     <input name="amount" type="text" id="get_donation_amt" required="required" /> 
    </div> 
    <input name="donation_submit" type="submit" id="Submit" value="Proceed" onclick="return donationFormSend();" /> 
    </form> 

이 도움을 받고 기뻐할 것입니다.

+2

'return confirm (...);'? –

+0

제출과 비슷하지만 실제로 링크가 아닌 링크를 사용하면 어떨까요? 이렇게하면 주변을 너무 많이 망칠 필요가 없습니다. 그것을 클릭하면 실제 제출 또는 비슷한 것을 알 수 있습니다. – Patrick

+0

@ 패트릭 - 유형 제출 = 유형 '제출'에서 유형 = '버튼'으로 양식 제출 유형을 변경하는 것과 같은 것을 의미합니다 ... 그게 당신이 제안하는 것입니까? – Ous

답변

1

I updated your jsfiddle 그래서 예상되는 형식 (머리에 JS로드)과 FF에 완벽하게 나를 위해 잘 확인 결과

return confirm('blah blah')

작품 반환에 있어요! 캐시를 지우고 페이지를 새로 고침하십시오.

0
In your HTML use : onclick="return donationFormSend();" 
In Your Javascript: return confirm("Are you sure ....blah blah blah") 
0

수행 할 수있는 방법이 될 수 있습니다

형태 :

<form id='test' method="post" action=""> 
    <div> 
      <div>Donation Amount:</div> 
      <input name="amount" type="text" id="get_donation_amt" required="required" /> 
    </div> 
     <input type="submit" value="submit" onClick="form_submit(this.value)"> 
    <input type="submit" value="cancel" onClick="form_submit(this.value)"> 
    </form> 

자바 스크립트 :

document.getElementById('test').addEventListener('submit',function (event) { 
if (event.preventDefault) { 
     event.preventDefault(); 
    } else { 
     event.returnValue = false; 
    } 
}) 

form_submit= function (submited_by) { 

    if(submited_by == 'submit'){ 
    alert('Submited') 
    }else if (submited_by == 'cancel'){ 
    alert('cancelled') 
    } 

} 

차라리 미래에 그것을 확장하기 위해 switch 문을 사용하십시오 그러나 이것은 효과가있다.

또한 jquery를 사용하고 있는데, 기본 동작을 중지하는 방법을 모르므로 주로 사용하고 있습니다.

여기에 코드가 실행되는 JSFiddle이 있습니다.

편집 : Jquery를 사용하지 않도록 업데이트되었습니다.

편집 : 글쎄, 지금 바보 같아서 제출 양식에있는 취소 버튼이 아니라 확인 양식에 있음을 깨달았습니다.

관련 문제