Jump to content

Update product price when adding accesories

Herland
 Share

Recommended Posts

Herland Newbie

Herland

Posted
Posted (edited)

Hi precious community

 

I am looking forward to update the product price in real time when attempting to add accesories. I know for most it won't be necesary but here is the link of a product with accesories in my page:

 

http://208.86.249.10...p?id_product=38

 

and here is the image:

 

productscreen_zpse28abd4e.jpg

 

So, when I click on an accesory, I want the product price to update in that page. Is that possible, is there an addon, extension?

 

Thanks

Edited by Herland (see edit history)
Link to comment
Share on other sites
Herland Newbie

Herland

Posted
  • Author
Posted

This has been white tough, I've spent lots of time on this one, but I just can't get it. I have used lots of JQuery and javascript. Here is what I got by the minute, doing the test on a localhost page:

 



<html>
<head>
<?php
//I attemtp to use window in javascript to make the variable visible everywhere
//so the product price can update
$productprice = 5000; 
//this is the sample price of my product 
?>
<script type="text/javascript" src="jquery-1.9.0.min.js"></script>
</head>
<body>
<p id="price"> $<?php echo $productprice; ?> </p> 
<!-- this displays the product price in the webpage-->
<br>

<input id="check_precio1" type="checkbox" name="monotreme" value="platypus" /> <a>$50</a><br>  
<!--this one is the checkbox for accesory numer 1 -->
<input id="check_precio2" type="checkbox" name="monotreme" value="platypus" /> <a>$60</a>
<!--this one is the checkbox for accesory numer 2 -->
<script>
$(document).ready(function() {

var price = "<?php echo $productprice; ?>"; 
//here we pass the php variable of '$productprice' to 
//the javascript variable 'price', works
price1 = parseInt(price);
//here I parse the price String to a Int variable of price1

window.accesory1 = 50;  //this is the price of the accesory number 1



$('#check_precio1').change(function() {

 if ($(this).is(':checked')) {

   window.total = price1 + window.total + window.accesorio1;
   //here I attempt to add the result of total price with the sum 
   //of accesory1

       this.checked = document.getElementById("precio").innerHTML = window.total;

   } else {
 //here I attempt to add the result of total price with the sum 
   //of accesory1, but with value of 0, so it can come back 
   //to the previous total value
   window.accesory1 = 0;
     window.total = price1 + window.total + window.accesory1;
$('#precio').html(window.total);

   }

 /*
   if (!$(this).is(':checked')) {
       document.getElementById("precio").innerHTML = precia;
       } else {
document.getElementById('precio').innerHTML = precio;
           }
   } */
});

});

</script>

<script>
//here is the same code as with the first javascript code block
//I just change the id value form check_price1 to check_price2

$(document).ready(function() {

var price = "<?php echo $productprice; ?>"; 
price1 = parseInt(price);

window.accesory1 = 50;  



$('#check_prece2').change(function() {

 if ($(this).is(':checked')) {

   window.total = price1 + window.total + window.accesorio1;

       this.checked = document.getElementById("precio").innerHTML = window.total;

   } else {
   window.accesory1 = 0;
     window.total = price1 + window.total + window.accesory1;
$('#precio').html(window.total);

   }

 /*
   if (!$(this).is(':checked')) {
       document.getElementById("precio").innerHTML = precia;
       } else {
document.getElementById('precio').innerHTML = precio;
           }
   } */
});

});

</script>
</body>
</html>

 

javascript_zpse4bbf051.jpg

 

But I just can't initialize the window.total variable because it's used here window.total = price1 + /* here */ window.total + window.accesory1; and If i initialize it it will take value 0 on each Query.

 

I almost got this code done, but I need some help, thank you guys

Link to comment
Share on other sites
 Share
Go to topic listing
×
×
  • Create New...