PayPal:在多个选项框之间切换?

时间:2015-05-21 03:27:53

标签: jquery paypal

我一直在阅读有关如何使用PayPal表单的一些内容。我创建了一个表单来使用选项,但我希望能够在两个下拉框之间切换,具体取决于他们是选择选项A还是选项B ...

(我发现远程关闭的唯一问题是 - Creating Multiple Select Option Box in Paypal Shopping Cart - 我不明白。)

以下是一些示例代码:

<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top" data-abide>
    <input type="hidden" name="cmd" value="_xclick">
    <input type="hidden" name="business" value="matt.roberts.33@gmail.com">
    <input type="hidden" name="bn" value="MRobertsDesign_BuyNow_WPS_CA">
    <input type='hidden' name='lc' value='CA'>
    <input type="hidden" name="currency_code" value="CAD">
    <input type="hidden" name="no_shipping" value="0">
    <input type="hidden" name="no_note" value="1">
    <input type="hidden" name="return" value="http://mrobertsdesign.ca/design/payments/completed/">
    <input type="hidden" name="cancel_return" value="http://mrobertsdesign.ca/design/payments/cancelled/">
    <input type="hidden" name="item_number" value="service-plan">

    <input type="text" placeholder="What is your name?" id="pack_name" name="os1" maxlength="100">

    <select id="pack_type" name="item_name">
        <option value="">Choose a plan:</option>
        <option value="Basic">Basic - Starting at $90</option>
        <option value="Advanced">Advanced - Starting at $190</option>
    </select> 

    <!-- Options A (Basic) -->
    <select id="pack_time" name="os0">
        <option value="">Choose your hours:</option>
        <option value="2hrs">2 Hours - $90.00</option>
        <option value="3hrs">3 Hours - $180.00</option>
        <option value="4hrs">4 Hours - $228.00</option>
    </select> 
    <input type="hidden" name="option_select0" value="2hrs">
       <input type="hidden" name="option_amount0" value="90.00">
    <input type="hidden" name="option_select1" value="3hrs">
       <input type="hidden" name="option_amount1" value="180.00">
    <input type="hidden" name="option_select2" value="4hrs">
       <input type="hidden" name="option_amount2" value="228.00">

    <!-- Options B (Advanced) -->
    <select id="pack_time" name="os0">
        <option value="">Choose your hours:</option>
        <option value="2hrs">2 Hours - $190.00</option>
        <option value="3hrs">3 Hours - $240.00</option>
        <option value="4hrs">4 Hours - $328.00</option>
    </select> 
    <input type="hidden" name="option_select0" value="2hrs">
       <input type="hidden" name="option_amount0" value="190.00">
    <input type="hidden" name="option_select1" value="3hrs">
       <input type="hidden" name="option_amount1" value="240.00">
    <input type="hidden" name="option_select2" value="4hrs">
       <input type="hidden" name="option_amount2" value="328.00">

    <input type="hidden" name="on1" value="Client">
    <input type="hidden" name="on0" value="Hours">
    <input type="submit" name="submit" class="button radius payments-buy" value="Buy Now">
</form>

这个想法是当有人选择基本或高级时:

    <select id="pack_type" name="item_name">
        <option value="">Choose a plan:</option>
        <option value="Basic">Basic - Starting at $90</option>
        <option value="Advanced">Advanced - Starting at $190</option>
    </select> 

它会将下拉选项分别更改为A或B.

现在我不确定如何解决这个问题,任何人都有任何想法?我不确定你是否理解我在做什么,但请问我是否需要更多澄清,我不知道还能说些什么。

我更了解PHP,所以我明白了......当有人点击该下拉框并选择Basic或Advance时,它需要触发一个jQuery脚本,该脚本将首先检查以查看&#39;单击后,循环遍历数组中的值并填充表单。我只是不知道怎么做,任何人都想试一试?

为了举例,我几乎想要获得这个psuedo-php代码的JS / jQuery版本:

<select id="pack_type" name="item_name">
    <option value="">Choose a plan:</option>
    <option value="Basic">Basic - Starting at $90</option>
    <option value="Advanced">Advanced - Starting at $190</option>
</select> 

<?php
    // I know this doesn't work but for the sake of example
    if (select.pack_type option.basic.selected) {
        var $pack_type = 'basic';
    } elseif (select.pack_type option.advanced.selected) {
        var $pack_type = 'advanced';
    } else {
        var $pack_type = NULL;
    }

    // Basic
    $plan['basic'][] = array(
        'hours' => '2 Hours', 
        'price' => '90.00',
    );
    $plan['basic'][] = array(
        'hours' => '3 Hours', 
        'price' => '120.00',
    );
    $plan['basic'][] = array(
        'hours' => '4 Hours', 
        'price' => '250.00',
    );

    // Advanced
    $plan['advanced'][] = array(
        'hours' => '2 Hours', 
        'price' => '190.00',
    );
    $plan['advanced'][] = array(
        'hours' => '3 Hours', 
        'price' => '220.00',
    );
    $plan['advanced'][] = array(
        'hours' => '4 Hours', 
        'price' => '350.00',
    );

    // Other variables
    $i = 0;

    if ($pack_type == 'basic') {
        // Echo basic
        echo '<select id="pack_time" name="os1"><option value="">Choose your hours:</option>';
            foreach ($plan['basic'] as $prices) {
                echo '<option value="' . $prices['hours'] . '">' . $prices['hours'] . ' - $' . $prices['price'] . '</option>';
            }
        echo '</select>';
        foreach ($plan['basic'] as $prices) {
            echo '<input type="hidden" name="option_select' . $i++ . '" value="' . $prices['hours'] . '"><input type="hidden" name="option_amount' . $i++ . '" value="' . $prices['price'] . '">';
        }
    } elseif ($pack_type == 'advanced') {
        // Echo advanced
        echo '<select id="pack_time" name="os1"><option value="">Choose your hours:</option>';
            foreach ($plan['advanced'] as $prices) {
                echo '<option value="' . $prices['hours'] . '">' . $prices['hours'] . ' - $' . $prices['price'] . '</option>';
            }
        echo '</select>';
        foreach ($plan['advanced'] as $prices) {
            echo '<input type="hidden" name="option_select' . $i++ . '" value="' . $prices['hours'] . '"><input type="hidden" name="option_amount' . $i++ . '" value="' . $prices['price'] . '">';
        }
    } else {
        // Echo nothing
        echo '<select id="pack_time" name="os1"><option value="">Choose your hours:</option></select>';
    }
?>

1 个答案:

答案 0 :(得分:1)

Paypal为您提供了选择下拉产品的选项,价格不同。

  1. 登录paypal。
  2. 转到个人资料选择&#39;我的销售工具&#39;
  3. 点击&#39;管理我的付款按钮&#39;
  4. 旁边的更新
  5. 创建新按钮
  6. 选中&#39;添加带价格/选项&#39;
  7. 的下拉菜单复选框
  8. 您将看到如下图所示的屏幕。
  9. enter image description here

    ADD:这是一个jsfiddle,可能会帮助您实现目标。下拉菜单,会在选择时显示和隐藏单独的按钮。

    Jquery的

        $('select.div-toggler').change(function(){
        var target = $(this).data('target');
        $(target).children().addClass('hide');
        var show = $("option:selected", this).data('show');
        $(show).removeClass('hide');
    });
    

    http://jsfiddle.net/TLBvx/61/