Magento : How to display selected custom option price in product detail page In price box

first of all you have to put button calculateprice

then onclick of calculateprice you have to call function chkprice()

        function chkpice()    {        var a=document.getElementById("options_1_text").value;         var b=document.getElementById("options_2_text").value;         var c=document.getElementById("options_3_text").value;         var d=document.getElementById("options_4_text").value;         var e=<?php echo $_product = $this->getProduct()->getPrice()?>;               var f=(a+b+c+d)+e;        var e=document.getElementById(('product-price-'+<?php echo $_product = $this->getProduct()->getId()?>)).innerHTML;        $('product-price-'+<?php echo $_product = $this->getProduct()->getId()?>).innerHTML =''+e.replace(<?php echo $_product = $this->getProduct()->getPrice()?>,d)+'</span>';    }

insted of options_1_text,options_2_text,options_3_text,options_4_text put your id it will get your result

First you do the function that takes care of updating the charges:

function updateCharges(){   var tmpText="";   $("input[type='select']").each(function{   tmpText+=$("#"+this.id+"option:selected").text()+"<br>";       });   $("#detailDiv").html(tmpText)}

Then you just bind the selects to that function

$("input[type='select']").change(updateCharges)

Now you just have to make sure to include in your template a <div id="detailDiv"></div>

I would just create a custom block with the above code and place it inside the product detail page. Also you should check the selectors used, they will look for absolutelty ALL selects on the page, so thats not what you may want. But its just a matter of firebug-ging untill the aproppiate selector is found

Recently I need something similar. Perhaps it is helpful for you.

Block class:

class Foo_Bar_Block_Baz extends Mage_Catalog_Block_Product_View {        protected function getOptionDataCollection($options) {        $optionDataCollection = array();        foreach ($options as $option) {            $optionDataCollection[$option->getData('option_id')] = array_filter($option->getData());        }        return $optionDataCollection;    }    protected function getOptionValueDataCollection($options) {        $optionValueDataCollection = array();        foreach ($options as $option) {            $optionType = $option->getType();            if ($optionType == 'drop_down') {                $optionValues = $option->getValues();                foreach ($optionValues as $valueItem) {                    // here you could also use the option_type_id (in my case  I needed the sku)                    $optionValueDataCollection[$valueItem->getData('sku')] = array_filter($valueItem->getData());                }            } else {                //Mage::throwException('Unexpected input. Processing for this optionType is not implemented');            }        }        return $optionValueDataCollection;    }    public function getOptionsJson() {        $data = array(            'options' => array(),            'optionValues' => array()        );        $options = $this->getProduct()->getOptions();        array_push($data['options'], $this->getOptionDataCollection($options));        array_push($data['optionValues'], $this->getOptionValueDataCollection($options));        $optionsJson = json_encode($data);        return $optionsJson;    }}

Template

<script id="optionsJson" type="application/json">    <?php echo $this->getOptionsJson(); ?></script>

JS

var json = JSON.parse(document.getElementById("optionsJson").innerHTML),    options = json.options[0],    optionValues = json.optionValues[0];    optionValues['<optionValueSKU>'].default_title    optionValues['<optionValueSKU>'].price