使用jquery来改变选择价格,用php函数回显价格

时间:2014-02-13 15:10:28

标签: php jquery variables select

我正在创建一个购物车,我无法让jquery和php正常工作。我有一个名为displayAmount($price)的函数,目前只是将数字格式化为2个小数点并将Pounds Sterling符号添加到它。我希望将此功能保留为将来当我看到能够允许用户更改其本地货币时,它将使用此功能来计算并显示正确的价格和货币。

我希望能够在查看产品页面上显示价格,并在用户更改选择框中的选项时更改价格。

所以我有这个:

jQuery的:

$("select").live('change',function () {
      var price = 0;
      $("select option:selected").each(function () {
        price += parseFloat($(this).data('price'));
      });
      $('#productPriceLabel').html(price);
    });

HTML:

<select class='productSelectOptions'>
<option data-price='+10'>+10</option>
<option data-price='+20'>+20</option>
</select>
<br>
<span id='productPriceLabel'></span>

这可以改变价格。但是,我需要能够使用echo displayAmount($price)

来回显价格

我该怎么做?

由于

编辑:

function displayAmount($amount)
    {
        $xamount = str_replace('.', '', $amount);
        $type = gettype($xamount);

        if($type = integer) {
            global $Config;
            return $Config['currency'] . number_format($amount, 2);
        } else {
            return $amount;
        }
    }

第二编辑:(完整代码)

// Get prices from database
                    $priceSQL = "SELECT *
                                FROM shopProductsPrices
                                WHERE pd_id = '$productId'";    
                    $priceResult = dbQuery($priceSQL);
                    $priceOptions = "";
                    $productLowestPrice = 10500;
                    while($priceRow = dbFetch($priceResult)) {
                        if($productLowestPrice > $priceRow['spp_price']) { $productLowestPrice = $priceRow['spp_price']; }
                        $priceOptions .= "<option data-price='+".$priceRow['spp_price']."'>".$priceRow['spp_name']."</option>";
                    }
                    if($productLowestPrice == 10500) { $productLowestPrice = 0; }







<table style="border: none; width: 300px;">
                                                <tr>
                                                    <td>
                                                        <span id="productContentItem">Package:</span>
                                                    </td>
                                                    <td>
                                                        <select class='productSelectOptions'>
                                                            <?= $priceOptions ?>
                                                        </select>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        <span id="productContentItem">Quantity:</span>
                                                    </td>
                                                    <td>
                                                        <select class='productSelectOptionsQty'>
                                                            <option value="1">x1</option>
                                                            <option value="2">x2</option>
                                                            <option value="3">x3</option>
                                                        </select>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                    </td>
                                                    <td>
                                                        <?= $productAddToBasket ?>
                                                    </td>
                                                </tr>
                                            </table>

                                                        <span id='productPriceLabel'><?= displayAmount($productLowestPrice) ?></span>
<script>
    $(".productSelectOptions").live('change',function () {
      var price = 0;
      $(".productSelectOptions option:selected").each(function () {
        price += parseFloat($(this).data('price'));
        $.ajax({
          type: "POST",
          dataType: "html",
          url: '<?= SERV_ROOT ?>library/common.php',
          data: '&price='+price,
          success: function(returnedData){
            $('#productPriceLabel').html(returnedData);
          },
          error: function(){
            $('#productPriceLabel').html('Error Formatting');
          }
        }); //END Ajax
      });

    });
</script>

1 个答案:

答案 0 :(得分:1)

以下是我在评论中无法提及的内容:

我将“选择更改”功能更改为仅在更改“productSelectOptions”时执行。否则,它将在更改任何选择选项时执行。那是你想要的吗?

以下是更改后的jQuery代码,它会将您的新价格发送到您的PHP页面,以便使用您的PHP函数进行格式化。

$(".productSelectOptions").live('change',function () {
  var price = 0;
  $(".productSelectOptions option:selected").each(function () {
    price += parseFloat($(this).data('price'));
    $.ajax({
      type: "POST",
      dataType: "html",
      url: 'formatdisplayAmount.php',
      data: '&price='+price,
      success: function(returnedData){
        $('#productPriceLabel').html(returnedData);
      },
      error: function(){
        $('#productPriceLabel').html('Error Formatting');
      }
    }); //END Ajax
  });

});

您的“formatdisplayAmount.php”将包含您的格式化功能,如下所示:

function displayAmount($amount)
{
  $xamount = str_replace('.', '', $amount);
  $type = gettype($xamount);

  if($type = integer) {
    global $Config;
    return $Config['currency'] . number_format($amount, 2);
  } else {
    return $amount;
  }
}

echo displayAmount($_POST['price']);