PDA

View Full Version : jquery post load manipulation



mdez13
02-25-2014, 03:44 PM
I'm currently using a script on an ecommerce website that shows or hide a free shipping stamp based on a number(price). Initially the stamp shows for all products and i hide it where necessary. My problem is, the script reads from the 'regular price' and will display the stamp accordingly, but i have products with promotions that hides the regular price and displays the promo price then bringing the actual price of the product under the appropriate limit and i can't figure out a way to hide the free shipping stamp on those particular items.

I'm using the following to remove the tag if the price goes under 99, but with my hackish promotion price display, i cant figure out how to read that post load promo price display to apply the function as needed. I've tried replicating this script and applying it to the promo price div to no avail. Any suggestions as to how i can read a divs numerical contents post load and hide the stamp? I'm beginner to intermediate when it comes to jquery so help in layman's terms would be helpful.


$('#results-table .redprice, #pp-wrap #big-price span').each(function(){
var $this = jQuery(this);
var number=$this.html();
number=number.substring(1);
number=parseFloat(number);
if(number > 50){$this.parents('div.grid3wrapper, div.list3wrapper, #pp-wrap').addClass('over50');}
if(number > 99){$this.parents('div.grid3wrapper, div.list3wrapper, #pp-wrap').addClass('over99');}
if(number < 99){$this.parents('div.grid3wrapper, div.list3wrapper, #pp-wrap').addClass('under99').removeClass('freeshipping');}
});

Thank you.

jscheuer1
03-08-2014, 03:29 AM
Are you asking how to run the above code after the promo price appears? If so, and assuming that code works, it would probably be best to have the above code as a function, ex:


function check4freeshipping(){
$('#results-table .redprice, #pp-wrap #big-price span').each(function(){
var $this = jQuery(this);
var number=$this.html();
number=number.substring(1);
number=parseFloat(number);
if(number > 50){$this.parents('div.grid3wrapper, div.list3wrapper, #pp-wrap').addClass('over50');}
if(number > 99){$this.parents('div.grid3wrapper, div.list3wrapper, #pp-wrap').addClass('over99');}
if(number < 99){$this.parents('div.grid3wrapper, div.list3wrapper, #pp-wrap').addClass('under99').removeClass('freeshipping');}
});
}

Then, whenever the prices are set, run the check4freeshipping function.

All that remains to be determined is, when are the prices set? If it's - say on load of the page, you could do:


jQuery(window).load(check4freeshipping);

If it's at some other time and is synchronous, you could just do it right after the price is set, ex:


//code here that sets the prices
check4freeshipping();

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.