1

I'm looking to have the prices change on my price list page based on a URL parameter. This is what I'm trying to accomplish exactly:

The page has default prices on it for regular customers, but when a special customer wants to get their pricing, they would input ?price=myprice into the url. So instead of "website.com/price-list" they would put in "website.com/price-list?price=myprice" and this would increase all the prices on the list by 15%.

What would be the best way to do this?

Vincent
  • 13
  • 2
  • 3
    You simply have to read the get parameter and then act accordingly... – Black Jul 20 '18 at 17:27
  • 3
    Would typically do this server side – charlietfl Jul 20 '18 at 17:27
  • 1
    https://stackoverflow.com/a/979995/7113839 Possibly use something like this – BStill Jul 20 '18 at 17:30
  • 3
    If you do this, I'm getting products for free by messing with the query string. This would catch fire in the real world. What you really want is to be tracking who is logged in and adjust pricing accordingly on the SERVER side based on that, this exposes your pricing to be easily manipulated. – Paul Swetz Jul 20 '18 at 17:32
  • It is an internal price list for wholesale customers that isn't connected to any ecommerce systems. It's purely informational. – Vincent Jul 20 '18 at 19:27

1 Answers1

1

You can parse the URL for each parameter and then perform the price edits upon page load with jQuery. There are tough (but robust) ways to do this, and also very straight forward ways to do this.

Firslty, note that window.location has a search member, which contains all characters after and including a ? in the url. With that knowledge you can just get the indexOf whatever you are looking for in the URL parameters. If indexOf returns something other than -1 you're in business.

$(document).ready(function(){
  //Store the search.
  var search = window.location.search;
  //Look for the url parameter in the search.
  if(search.indexOf("price=myprice") > -1){
    //Go through each price element (Selector Should be the element containing the actual price number.)
    $(".selector.to.price-text.element").each(function(){
      //Calculate the new price based on the old price.
      var newPrice = parseFloat($(this).text()) * 1.15;
      //Put the new price onto the page. (Lines not condensed for readability).
      $(this).text(newPrice);
    });
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

The code above isn't going to be turn key for your application, you will need to change the selector at minimum.

As stated in the comments to your question by Paul Swetz you should track your price changes based on which user is viewing the page.

Zackary Jones
  • 371
  • 1
  • 9
  • Thanks for the answer! The page is purely informational and not connected to any ecomemrce systems, so there's no concern of anyone manipulating it. This works nearly perfectly. The only issue I'm facing is instead of rounding up it's showing the whole numerical value. 49.99 becomes 57.488499999999995. Any way to fix this? – Vincent Jul 20 '18 at 20:09
  • I fixed it. For anyone wondering, I changed $(this).text(newPrice); to $(this).text('$'+ Math.ceil(newPrice)); and now it rounds up. – Vincent Jul 20 '18 at 20:36