引導模式下提交信用卡表格

Question

我為我的信用卡付款表格創建了引導模式，我想驗證信用卡表格，現在在jquery中使用基本驗證。

<script>
$(function() {
$('#error_message_reg').text("");
//$( "submitBtnRegister" ).click(function() {
$('#register_form').on('submit', function()  {
 //e.preventDefault();
var error=false; 
var firstName = $('#payment_first_name').val();
var lastName = $('#payment_last_name').val();
var adress = $('#payment_address').val();
var city = $('#payment_city').val();
var state = $('#payment_state').val();
var zip = $('#payment_zip').val();
var country = $('#payment_country').val();
var cc_no = $('#payment_card_no').val();
var cc_month = $('#payment_card_expiry_month').val();
var cc_year = $('#payment_card_expiry_year').val();
var cc_ccv = $('#payment_card_ccv').val();
var postal_code = $('#payment_card_postal_code').val();






if(firstName == null || firstName == "") {
            $('#error_message_reg').text("FIrst name is required");
            var error=true;
            return false;
        }



if(lastName == null || lastName == "") {
            $('#error_message_reg').text("Last name is required.");
            var error=true;
            return false;
        }
if(adress == null || adress == "") {
            $('#error_message_reg').text("Adress is required.");
            var error=true;
            return false;
        }
if(city == null || city == "") {
            $('#error_message_reg').text("City is required.");
            var error=true;
            return false;
        }
if(state == null || state == "") {
            $('#error_message_reg').text("state is required.");
            var error=true;
            return false;
        }
if(zip == null || zip == "") {
            $('#error_message_reg').text("Zip is required.");
            var error=true;
            return false;
        }
if(country == null || country == "") {
            $('#error_message_reg').text("country is required.");
            var error=true;
            return false;
        }
if(cc_no == null || cc_no == "") {
            $('#error_message_reg').text("Card number is required.");
            var error=true;
            return false;
        }
if(cc_month == null || cc_month == "") {
            $('#error_message_reg').text("expiry month is required.");
            var error=true;
            return false;
        }
if(cc_year == null || cc_year == "") {
            $('#error_message_reg').text("expiry year is required.");
            var error=true;
            return false;
        }
if(cc_ccv == null || cc_ccv == "") {
            $('#error_message_reg').text("CVV is required.");
            var error=true;
            return false;
        }
if(postal_code == null || postal_code == "") {
            $('#error_message_reg').text("postal code is required.");
            var error=true;
            return false;
        }
if(error==false)
{
        $('#error_message_reg').text("");
        $('#register_form').submit();

}
});
});
</script>

我還想添加信用卡驗證，也就是這張卡有效。 我使用braintree作為我的付款網關，可以使用$result->errors->deepAll()檢查有效交易
但是當我提交表格時，模態會關閉。是否有任何方法可以防止關閉模態，直到Braintree的響應來了。 是否可以不使用ajax來執行此操作。

預先感謝

Answer 1

如果沒有頁面刷新，就無法進行服務器端驗證（因為您已經在不使用AJAX的情況下就被告知），當頁面刷新時，模式將被關閉。

否則，我們需要通過驗證卡片在URL中傳遞一些參數來重新打開頁面提交模式。

    <?php if(invalid card): ?>
<script>
reopen the modal with parameters posted
</script>
<?php endif; ?>

我建議使用AJAX是最好的方法。 在代碼底部，您可以添加

if(error==false)
{

$.post( "url to do server side validation", $("#register_form").serialize())
  .done(function( data ) {    //Better to have JSON as response
if(data.success === true)
{
    $('#error_message_reg').text("");
        $('#register_form').submit();
}
else
{
    $('#error_message_reg').text("error from response");
    return false;
}
  });

}