use jquery to change select price, echo price with php function

Question

I am creating a shopping cart and I am having trouble getting the jquery and php to work properly. I have a function called displayAmount($price) which at the moment just formats the number to 2 decimal points and adds the Pounds Sterling symbol to it. I would like to keep this function as in the future when I look at being able to allow the user to change their local currency, it will use this function to calculate and display the correct price and currency.

I want to be able to display a price on the view product page and have it change when the user changes the options in the select boxes.

So I have this:

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>

This works fine to change the price. However I need to be able to echo the price using echo displayAmount($price)

How can I do this?

Thanks

EDIT:

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;
        }
    }

SECOND EDIT: (FULL CODE)

// 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>

Answer 1

Here is what I couldn't put in my comment:

I changed your "select on change" function to only execute when your "productSelectOptions" is changed. Otherwise, it would execute when ANY select option is changed. Was that what you wanted?

Here is the altered jQuery code that will send your new price to your PHP page to be formatted using your PHP function.

$(".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
  });

});

Your "formatdisplayAmount.php" would include your formatting function and look something like below:

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']);