“金额”字段未通过PayPal

Question

我正在为非盈利客户开发一个网站，其中包括自定义捐赠表单。该表单包括用户选择预定捐赠金额或输入自己金额的选项，然后单击“捐赠”，将其带到PayPal。我已经确认实际的捐赠按钮通过我的Sandbox帐户进行了三次成功的测试。我还能够确认自定义表单正确计算所选金额并填充“金额”字段的值，因为我能够在控制台中记录这些结果。我可以说，“金额”字段符合PayPal的指导方针。但是，金额不会传递给PayPal。

前端代码：

<div id="main-donate-container" class="form_container">
    <form action="https://www.sandbox.paypal.com/cgi-bin/webscr" method="post" target="_top">
          <div id="small-button-container" class="">
             <div id="twenty-five" class="lightred general_button blue_button form_small_button selected_amount select_state_color_btn"><span>25</span></div>
             <div id="fifty" class="general_button blue_button form_small_button select_state_color_btn"><span>50</span></div>
             <div id="one-hundred" class="general_button blue_button form_small_button select_state_color_btn"><span>100</span></div>
             <div id="two-hundred" class="general_button blue_button form_small_button select_state_color_btn"><span>200</span></div>
          </div>
          <div id="other-amount" class="general_button blue_button form_other_amount">
             <span><img src="<?php $root ?>/images/close.png"/></span>
             <label>$</label><input class="whitetext" type="text" name="other-amount" value="143">
          </div>
          <div id="other-amount-button" class="general_button blue_button select_state_color_btn">
              <span>OTHER</span>
          </div>
          <input id="donation-amount" type="hidden" name="amount" value="">                            
          <input type="hidden" name="cmd" value="_s-xclick">
          <input type="hidden" name="hosted_button_id" value="(PayPal key here)">
          <input type="submit" class="general_button blue_button submit_button" id="submit" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!" value="Donate!">
          <img alt="" border="0" src="https://www.sandbox.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1">
    </form>
</div> <!-- end main donate container -->

幕后的JavaScript：

//initialize variables to track donation amounts    
var donation_amount = 25;
var previous_donation = 0;

//format the amounts displayed in buttons as US currency
$('#donate-content .form_small_button span').formatCurrency({roundToDecimalPlace:0});


$('#donate-content #other-amount-button').on('click',function(){
        //save the previously selected donation amount in case use cancels out of "other"
        previous_donation = donation_amount;
        //set new donation amount to the default "other" amount
        donation_amount = $('#other-amount input').val();
        //change background of other button and other amount field to #FFB310 and show the other amount field
        $(this).css('background-color','#BB6098');
        $('#donate-content #other-amount').css('background-color','#BB6098').show();
        $('#donate-content #other-amount-button').addClass('selected_amount');
        //format the amounts displayed in other amount field for US currency
        $('#donate-content #other-amount input').formatCurrency({symbol:'',roundToDecimalPlace:0});
        $('#donate-content #other-amount input').select();
    });

$('#donate-content #other-amount span').on('click',function(){
        donation_amount = previous_donation;
        $('#donate-content #other-amount-button').css('background-color','rgba(67, 80, 164, .9)').removeClass('selected_amount');;
        $('#donate-content #other-amount').hide();
        $('#donate-content #other-amount input').val('143');
    }); 

$('#donate-content #other-amount input').keyup(function(){
        donation_amount = $(this).val();
    });

$('#donate-content #other-amount input').keypress(function(event){
        return isNumber(event);
    });

$('#donate-content #twenty-five').on('click',function(){
        $('#donate-content .select_state_color_btn').css('background-color','rgba(67, 80, 164, .9)').removeClass('selected_amount');
        $(this).addClass('selected_amount').css('background-color','#C25252');
        donation_amount = $(this).text();
        donation_amount = donation_amount.slice(1);
    });

$('#donate-content #fifty').on('click',function(){
        $('#donate-content .select_state_color_btn').css('background-color','rgba(67, 80, 164, .9)').removeClass('selected_amount');
        $(this).addClass('selected_amount').css('background-color','#CA9859');
        donation_amount = $(this).text();
        donation_amount = donation_amount.slice(1);
    });

$('#donate-content #one-hundred').on('click',function(){
        $('#donate-content .select_state_color_btn').css('background-color','rgba(67, 80, 164, .9)').removeClass('selected_amount');
        $(this).addClass('selected_amount').css('background-color','#7E0B80');  
        donation_amount = $(this).text();
        donation_amount = donation_amount.slice(1);
    });

$('#donate-content #two-hundred').on('click',function(){
        $('#donate-content .select_state_color_btn').css('background-color','rgba(67, 80, 164, .9)').removeClass('selected_amount');
        $(this).addClass('selected_amount').css('background-color','#59ABB7');  
        donation_amount = $(this).text();
        donation_amount = donation_amount.slice(1);
    });

$('#donate-content .select_state_color_btn').hover(
function(){
        if ($(this).hasClass('selected_amount')){
            var color = $(this).css('background-color');
            $(this).css('background-color',color);
        }
            else{   
            $(this).css('background-color','#ccc');
        }
    },
function(){

        if ($(this).hasClass('selected_amount')){
            var color = $(this).css('background-color');
            $(this).css('background-color',color);
        }
            else{

            $(this).css('background-color','rgba(67, 80, 164, .9)');
            }

        });

$('#donate-content #other-amount-button').hover(
function(){
        if ($(this).hasClass('selected_amount')){
            var color = $(this).css('background-color');
            $(this).css('background-color',color);
        }
            else{   
            $(this).css('background-color','#ccc');     }
    },
function(){

        if ($(this).hasClass('selected_amount')){
            var color = $(this).css('background-color');
            $(this).css('background-color',color);
        }
            else{   
            $(this).css('background-color','rgba(67, 80, 164, .9)');
            }

        });


$('#donate-content #submit').hover(
function(){
            $(this).css('background-color','#96BA5F');
    },
function(){
            $(this).css('background-color','rgba(67, 80, 164, .9)');    
        });

$('#donate-content #submit').on('click',function(e){
        $('#donate-content #donation-amount').val(donation_amount);

任何人都可以指出我确定的是我缺少的小细节吗？

提前致谢！

更新：我确定已将“金额”变量添加到PayPal端的托管按钮，但仍然没有乐趣。

Answer 1

经过进一步研究，结果发现托管的PayPal按钮不接受“金额”自定义字段。为了实现此功能，必须使用非托管按钮。最终结果是从PayPal生成一个非托管按钮，其结果在前端代码中看起来像这样（JavaScript保持不变）：

<form action="https://www.sandbox.paypal.com/cgi-bin/webscr" method="post" target="_top">
    <input type="hidden" name="cmd" value="_donations">
    <input type="hidden" name="business" value="(Place you PayPal key here)">
    <input type="hidden" name="lc" value="US">
    <input type="hidden" name="item_name" value="Test Charity">
    <input type="hidden" name="no_note" value="1">
    <input type="hidden" name="no_shipping" value="2">
    <input type="hidden" name="rm" value="1">
    <input type="hidden" name="return" value="(Your success URL here)">
    <input type="hidden" name="cancel_return" value="(Your cancel landing URL here)">
    <input type="hidden" name="currency_code" value="USD">
    <input type="hidden" name="bn" value="PP-DonationsBF:btn_donate_LG.gif:NonHosted">
    <input id="donation-amount" type="hidden" name="amount" value="">                       
    <input type="submit" class="general_button blue_button submit_button" id="submit" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!" value="Donate!">
    <img alt="" border="0" src="https://www.sandbox.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1">
</form>