在一个页面上的两种形式 - 输入类型转移

我在一个页面上有两种形式来处理2个条纹订阅（基本和高级）的选择，我使用javascript按钮提交每个表单，如下所示：在一个页面上的两种形式 - 输入类型转移

对于基本计划：

<form id="payment_form_basic" action="" method="POST"> 
<input type="hidden" name="subscription_purchase_non_trial" value="subscription_purchase_non_trial_basic" /> 
<button id="pricing__action_grey">Choose Plan</button> 
</form> 

<script src="https://checkout.stripe.com/checkout.js"></script> 

<script> 
// ****************************************** 
// ****** Basic Plan Form Processor ********* 
// ****************************************** 

var handler = StripeCheckout.configure({ 
key: '<?php echo $stripe['publishable_key']; ?>', 
image: 'https://example.com/example.png', 
locale: 'auto', 
allowRememberMe: 'false', 
token: function(token) { 
$('#payment_form_basic').append($('<input type="hidden" name="stripeToken" />').val(token.id)); 
$('#payment_form_basic').append($('<input type="hidden" name="stripeEmail" />').val(token.email)); 
$("#payment_form_basic").submit(); 
} 
}); 

document.getElementById('pricing__action_grey').addEventListener('click', function(e) { 
// Open Checkout with further options: 
handler.open({ 
name: 'Basic', 
description: 'example description', 
zipCode: true, 
amount: 10 
}); 
e.preventDefault(); 
}); 

// Close Checkout on page navigation: 
window.addEventListener('popstate', function() { 
handler.close(); 
}); 
</script>

，并为高级计划：

<form id="payment_form_advanced" action="" method="POST"> 
<input type="hidden" name="subscription_purchase_non_trial" value="subscription_purchase_non_trial_advanced" /> 
<input type="hidden" name="subscription_type" value="advanced" /> 
<button id="pricing__action">Choose Plan</button> 
</form> 

<script> 
// ****************************************** 
// ****** Advanced Plan Form Processor ****** 
// ****************************************** 

var handler = StripeCheckout.configure({ 
key: '<?php echo $stripe['publishable_key']; ?>', 
image: 'https://example.com/example.png', 
locale: 'auto', 
allowRememberMe: 'false', 
token: function(token) { 
$('#payment_form_advanced').append($('<input type="hidden" name="stripeToken" />').val(token.id)); 
$('#payment_form_advanced').append($('<input type="hidden" name="stripeEmail" />').val(token.email)); 
//$('#payment_form_advanced').append($('<input type="hidden" name="subscription_type" value="advanced" />')); 
$("#payment_form_advanced").submit(); 

} 
}); 

document.getElementById('pricing__action').addEventListener('click', function(e) { 
// Open Checkout with further options: 
handler.open({ 
name: 'Advanced', 
description: 'example descript', 
zipCode: true, 
amount: 12 
}); 
e.preventDefault(); 
}); 

// Close Checkout on page navigation: 
window.addEventListener('popstate', function() { 
handler.close(); 
}); 
</script>

我试图使用SUBSCRIPTION_TYPE领域的高级形式作为开关时的页面职位自己决定是否处理基本计划价格或高级计划然而形式仍然通过提交基本形式时发布“高级”订阅类型，好像先进从始终覆盖基本形式，在“当我打印收到的帖子变量时会出现什么情况，这对我来说毫无意义。有谁知道为什么会发生这种情况？

来源

2016-12-01 user1419810

显示您的js代码 –

是的。特别是如果你自己提交。改为改变每个“订阅”的名称。也许“subscription_basic”和“subscription_advanced” –

其实，一个不应该覆盖另一个。我运行了你的代码，它的工作原理应该如此。我用getElementById替换$，所以使用vanilla js，但不应该做差异。我正在使用Firefox。 'vardump（）'你的'$ _POST'每次提交并更新你的文章。 – mseifert

似乎我需要在点击功能中包装所有脚本（在每种情况下），这样高级设置不会超过为条带写入基本设置。希望这是一个强有力的方法。

来源

2016-12-01 07:01:12 user1419810

在一个页面上的两种形式 - 输入类型转移

回答

相关问题