Simple problem, not to me!

[MetalHepple]

Ok, I am trying to use a freeware shopping cart for a new website of mine. I am trying to customise it so it works for me. I will be using it to sell vinyl (stickers).

When I go to view a product on my site, it shows you the price, lets you change quantity, then add to basket. What I am wanting is to add another option which will change the price accordingly. A size option to be exact.



As you can see above, the default price will be £1.00, and as you change the size from the drop down box, it will add a certain percentage to the original value. That is what I want to happen. I have added the drop down box myself. It currently does nothing.

Here is the script from that complete page:

<!-- BEGIN SHOW -->
<script type="text/javascript">
<!--
  var sTitle = "$aData[sName]";
  var fPrice = Math.abs( $aData[fPrice] );
  if( !aCheckFormProduct ){
    var aCheckFormProduct =  Array(
      Array( 'iQuantity', 'int', '0', null, '>' )
      ,Array( 'iQuantity', 'int', '$aStock[iStock]', '$lang[Stock_limit]: $aStock[iStock] $lang[items]', '<=' )
    );
  }
//-->
</script>
<script type="text/javascript" src="$config[dir_js]checkForm.js"> </script>
<div id="productDetails">
	<h3>$aData[sCategories]</h3>
	<h2>$aData[sName]</h2>

  <div id="addCart">
		<h4>$lang[Shopping_cart]</h4>
		<form action="" method="get" onsubmit="return checkForm( this, aCheckFormProduct );">
			<fieldset>
				<input type="hidden" name="p" value="ordersBasket" />
				<input type="hidden" name="sOption" value="add" />
				<input type="hidden" name="iProduct" value="$aData[iProduct]" />
				<span><strong>$lang[Quantity]:</strong><input type="text" name="iQuantity" value="1" size="2" class="input" /></span>
				<em><input type="submit" value="$lang[Add_to_basket]" class="submit" /></em>
			</fieldset>
		</form>
    <a href="$config[index]?p=ordersBasket">$lang[my_cart]</a>
  </div>
	
	$aFiles[sPhotosDefault]
  <div class="price">
    <p><em>$lang[Price]:</em><span id="price">$aData[fPrice]</span>$config[currency_symbol]</p>
  </div>
  <form id="form1" name="form1" method="post" action="">
    <label>
      <select name="size" id="size">
        <option>4&quot;</option>
        <option>5&quot;</option>
        <option selected="selected">6&quot;</option>
        <option>7&quot;</option>
                            </select>
    </label>
  </form>
  <p>&nbsp;</p>
  <a href="javascript:window.print();" class="options" id="print"><img src="$config[dir_tpl]img/ico_print.gif" alt="$lang[print]" />$lang[print_product_page]</a>
  $sMorePhotosLink
	<div class="txt">
    $aData[sDescriptionFull]
  </div>
  $sMorePhotosTxt
	<div class="clear"></div>
  $aFiles[sPhotos]
  $aFiles[sFiles]
  <div id="back">&laquo;<a href="javascript:history.back();">$lang[back]</a></div>
</div>
<!-- END SHOW -->

<!-- BEGIN MORE_PHOTOS_LINK -->
  <a href="#morePhotos" class="options" id="morePhotosLink"><img src="$config[dir_tpl]img/ico_camera.gif" alt="$lang[more_photos]" />$lang[more_photos]</a>
<!-- END MORE_PHOTOS_LINK -->

<!-- BEGIN MORE_PHOTOS_TXT -->
  <h6>$lang[More_photos_and_files]<a id="morePhotos">&nbsp;</a></h6>
<!-- END MORE_PHOTOS_TXT -->

<!-- BEGIN PHOTOS_DEFAULT -->
  <div class="photo" id="l$aList[sStyle]"><a href="javascript:windowGallery( $aList[iPhoto], $aData[iProduct], 1 );"><img src="$aList[sPhotoSmall]" alt="$aList[sDescription]" title="$aList[sDescription]" /></a></div>
<!-- END PHOTOS_DEFAULT -->

<!-- BEGIN PHOTOS_HEAD --><div id="photosList"><!-- END PHOTOS_HEAD -->

<!-- BEGIN PHOTOS_LIST -->
    <div class="photo" id="l$aList[sStyle]"><a href="javascript:windowGallery( $aList[iPhoto], $aData[iProduct], 1 );"><img src="$aList[sPhotoSmall]" alt="$aList[sDescription]" title="$aList[sDescription]" /></a></div>
<!-- END PHOTOS_LIST -->

<!-- BEGIN PHOTOS_FOOT --><div class="clear"></div>
</div><!-- END PHOTOS_FOOT -->

<!-- BEGIN FILES_HEAD -->
<ul id="filesList">
<!-- END FILES_HEAD -->

<!-- BEGIN FILES_LIST -->
  <li class="l$aList[sStyle]"><img src="$config[dir_files]$config[dir_ext]$aList[sIcon].gif" alt="" /><a href="javascript:windowNew( '$config[dir_files]$aList[sFile]' );">$aList[sFile]</a>, $aList[sDescription]</li>
<!-- END FILES_LIST -->

<!-- BEGIN FILES_FOOT -->
</ul>
<!-- END FILES_FOOT -->

<!-- BEGIN TREE_PARENT --><a href="$aListTree[iParent],0,$aListTree[sParentUrl].html">$aListTree[sParent]</a><!-- END TREE_PARENT -->

<!-- BEGIN PARENT_SEPARATOR -->&raquo;<!-- END PARENT_SEPARATOR -->

<!-- BEGIN TREE_CHILD --><a href="$aListTree[iChild],0,$aListTree[sChildUrl].html">$aListTree[sChild]</a><!-- END TREE_CHILD -->

<!-- BEGIN TREE_SEPARATOR -->|<!-- END TREE_SEPARATOR -->

I hope someone can help?

Thankyou.

[?foru]

Welcome

I quickly took at a look at your code and saw this located in the div where your add to cart button is located <form action=""

Should that go to addtocart.php or something similar so that it's processed by php and added into your cart? A processing page could add the additional percentage that you specify in the dropdown.

One idea I am thinking about would be to add your percentage value into your drop down....for instance the 4" would have a 5 percent increase.
<option value="5">4&quot;</option>

Others might be able to get you on the right track with the processing so it adds your additional percentage value to the item total.

It may help to see the processing page code.