Jquery 단추가있는 양식 제출

Question

Shopify 전자 상거래 사이트에 일부 확인을 추가하여 "계산하기"버튼을 클릭 할 때 사용자가 국가를 확인해야합니다. 정상적인 JavaScript confirm() 대화 상자를 사용하여 완벽하게 작동하지만 JQuery UI를 사용하려고하므로 팝업에서 HTML을 사용할 수 있기를 원합니다.

JQuery UI가 팝업되어 양식 제출이 중지되지만 (그러나 그 중 하나를 이해하는 데 시간이 걸렸지 만) 사용자가 확인 버튼을 클릭 한 후 양식을 제출하는 방법을 알 수 없습니다. e.preventDefault를 사용하고 진행 버튼을 type="submit" 대신 type="button"으로 변경하여 양식이 진행되는 것을 막는 두 가지 방법을 발견했습니다. 두 가지 방법으로 양식이 더 이상 제출되지 않습니다.

양식 헤더 :

<form action="/cart" method="post" id="cartform" class="clearfix"> 

버튼을 type="submit"을 사용 HTML 코드 :

<div class="submit-cart"> 
    <div id="checkout-proceed"> 
     <input class="btn-reversed btn" type="submit" id="update-cart" name="checkout" value="Proceed to Checkout" /> 
     {% if additional_checkout_buttons %} 
     <div id="additional-checkout-buttons"> 
      <span id="additional-checkout-buttons-label">Or check out using:</span> 
     {{ content_for_additional_checkout_buttons }} 
     </div> 
     {% endif %}      
    </div> 
</div> 

"일반"자바 스크립트 실제로 위의와 양식을 제출 작동 코드 HTML :

$(document).ready(function(){ 
    $(".submit-cart input[type='submit'],.submit-cart input[type='image']").click(function(event){ 
     var x=confirm("Please confirm that you are ordering from the USA. \nIf you are ordering from Europe, please use the European store (...)."); 
     if (x == true) { 
      $(".submit-cart input").submit(); 
     } else { 
      return false; 
     } 
    }); 
}); 

JQuery code HTML 버튼이 type="submit"으로 설정된 양식을 제출하기 위해 e.preventDefault을 사용하여 클릭하여 제출하지 않으려 고합니다.

$(document).ready(function(){ 
    $(".submit-cart input[type='submit'],.submit-cart input[type='image']").click(function(event){ 
     event.preventDefault(); 
     $("#dialog-confirm").dialog({ 
      resizable: false, 
      height:300, 
      width: 400, 
      modal: true, 
      buttons: { 
       "Confirm": function() { 
        return true; 
        $(".submit-cart input").submit(); 
       }, 
       Cancel: function() { 
        $(this).dialog("close"); 
        return false; 
       } 
      } 
     }); 
    }); 
}); 

대신 submit의 type="button"에 HTML 버튼을 변경 한 후,이 내가 양식을 제출하는 데 사용할 노력하고있어 jQuery 코드입니다.

$(document).ready(function(){ 
    $(".submit-cart").click(function(){ 
     $("#dialog-confirm").dialog({ 
      resizable: false, 
      height:300, 
      width: 400, 
      modal: true, 
      buttons: { 
       "Confirm": function() { 
        return true; 
        $("#cartform").submit(); 
       }, 
       Cancel: function() { 
        $(this).dialog("close"); 
        return false; 
       } 
      } 
     }); 
    }); 
}); 

사용자가 PayPal로 결제 할 수있는 장바구니 페이지에 "PayPay PayPal"버튼이 있습니다. 이 버튼은 실제로 type = "button"메소드를 사용하여 올바르게 제출하는 것 같습니다.

Answer 1

는`submit`를 호출하기 전에 당신은`당신의 전화에 도달되지 않습니다를 TRUE '반환하면, 당신의 대화 확인 버튼 콜백에서 기능을

$('#cartform').submit();