CODEWITHSUNDEEP
javascriptbigcommerce
VC-OT
VC-OT

Reputation: 11

Javascript for Bigcommerce cart not working in IE

The following (very simple, not fantastic) JS script is being used in one of my client's Bigcommerce carts. It's designed to pick up a given BC customer group, and check the status of a given element (a radio button), then either show a given selector, or let it remain hidden. It works fine in every browser except IE, where it runs as normal, but never shows the selector, even when the console shows no errors. (Why is it running on a one-second interval? Because BC loads the cart four pieces at a time, but from the same page. Whee!)

Is there a JS function being used here that IE doesn't support? I've reviewed all the functions, and I'm not seeing anything, but you know how blind you can get from staring at the same code for a few hours.

[edit: It appears IE is picking up the keyphrase in the script, even though innerText isn't supposed to do that. But at least I'm a step closer to a solution!]

<script>
window.onload = setInterval(hideCC, 1000);

function hideCC ()
 {
/* Hide CC payment option for below listed groups only */
/* Add new customer groups with comma-separated list (i.e. [39,42,87]) */
var customergroup = [27,32,22,65,2,69,72,74,79,78,87,84,60,61,52,53,54,55,56,57,58,59,62,63,70,83,8,5];
/* Hide CC payment option for those using International Freight */
var intlFreight = document.documentElement.innerText.indexOf('International Freight');
/* Check state of wire transfer button; if it's checked, we don't need to do any of this */
var wireChecked = document.getElementById("radio-bankdeposit").checked;
if (wireChecked == true) {
    return;
}
else {
/* If the customergroup belongs to one of those listed above OR the text "International Freight" appears on the page, that will trigger this if */
if(customergroup.indexOf({{{customer.customer_group_id}}}) > -1 || intlFreight > -1 ) { 
/* console.log({{{customer.customer_group_id}}}); */
document.querySelector("#micro-app-ng-checkout > div > div > main > ol > li.checkout-step.checkout-step--payment.optimizedCheckout-checkoutStep > div.checkout-view-content > form > fieldset:nth-child(1) > div > ul > li.form-checklist-item.optimizedCheckout-form-checklist-item.form-checklist-item--selected.optimizedCheckout-form-checklist-item--selected").style.display="none"; 
}
}
};
</script>

Upvotes: 1

Views: 148

Answers (1)

Karen White
Karen White

Reputation: 2153

Here's the jQuery version of checking for the string within the "shippingOption-desc" class. Hopefully this will get around the issue with IE and innerText :)

var intlFreight = $('.shippingOption-desc').text().indexOf('International Freight');

Upvotes: 1

Related Questions