Please help (conflicting scripts on my product pages)
Posted: Mon Mar 24, 2014 3:59 pm
I am running into an issue with conflicting scripts on my page. The script that runs the "availability and image changer" is really slow and conflicting with my "toggle" script for the technifit option. Can someone please help me out as to what I am doing wrong? Here is the link to an item running both scripts http://shop.golfusa.com/Clubs/Hybrids/C ... ybrid.aspx. You can click the Customize button all day long to show and hide the Kit and Product Templates, but as soon as you select one of the top default options it kills its functionality.
Also, for reference here is the code straight from the ConLib:BuyProductDialog where the scripts are housed:
PLEASE HELP!
Also, for reference here is the code straight from the ConLib:BuyProductDialog where the scripts are housed:
Code: Select all
<%@ Control Language="C#" AutoEventWireup="True" Inherits="AbleCommerce.ConLib.BuyProductDialog" CodeFile="BuyProductDialogCustomTest.ascx.cs" %>
<%--
<conlib>
<summary>Displays product basic details and add-to-cart button to allow the produt to be added to cart.</summary>
<param name="ShowSku" default="True">If true SKU is displayed</param>
<param name="ShowPrice" default="True">If true price is displayed</param>
<param name="ShowSubscription" default="True">If true subscription details are displayed</param>
<param name="ShowMSRP" default="True">If true MRSP is displayed</param>
<param name="ShowPartNumber" default="False">If true Part/Model number is displayed</param>
<param name="ShowAllOptions" default="False">If true all product options are displayed</param>
<param name="IgnoreInventory" default="False">If true inventory is ignored</param>
</conlib>
--%>
<%@ Register Src="~/ConLib/Utility/ProductPrice.ascx" TagName="ProductPrice" TagPrefix="uc" %>
<script type="text/javascript">
$(function(){
$(".custom").hide();
$(".toggle").show();
$('.toggle').click(function(){
$(".custom").slideToggle();
});
});
</script>
<script type="text/javascript">
function change_text() {
var button = document.getElementById('toggle_button');
if (button.innerHTML === "Customize This Item") {
button.innerHTML = "Hide Customization";
}
else {
button.innerHTML = "Customize This Item";
}
}
</script>
<script type="text/javascript">
function OptionSelectionChanged(dropDownId)
{
var optDropDown = document.getElementById(dropDownId);
if(optDropDown != undefined)
{
var opt_index = optDropDown.selectedIndex;
var optid = optDropDown.options[opt_index].value;
var images = eval(dropDownId + '_Images');
var pImage = document.getElementById('ProductImage');
// determine the image url and update the image url link path for fancybox popup
if (pImage != undefined)
{
if ((images != undefined) && (images[optid] != undefined)) pImage.src = images[optid];
// image will be force updated to the default image when swatch image is absent
else if (_DefaultImageUrl != undefined) pImage.src = _DefaultImageUrl;
// update the image url used by fancybox, so it show correct image for selected option choice
var pathRegexp = /.*GetImage\.ashx\?Path=(~|%7e)(.*?)&.*/im;
match = pathRegexp.exec(pImage.src);
if (match != null) {
var pImageUrl = document.getElementById('ProductImageUrl');
if (pImageUrl != undefined) {
pImageUrl.href = match[2];
$('.productImage').click(function () { $('a.fancygallery').trigger('click'); });
}
}
}
}
return true;
}
</script>
<div class="buyProductDialog">
<h4 class="custom">Flex Menu must be selected, but only applies to standard shaft offerings.</h4>
<asp:UpdatePanel ID="BuyProductPanel" runat="server" UpdateMode="Always">
<ContentTemplate>
<asp:Panel ID="BuyProudctPanel" runat="server" DefaultButton="AddToBasketButton" CssClass="innerSection">
<div class="content">
<asp:ValidationSummary ID="ValidationSummary" runat="server" ValidationGroup="AddToBasket" />
<table class="buyProductForm">
<tr id="trSku" runat="server" enableviewstate="false">
<th class="rowHeader">
<asp:Localize ID="SkuLocalize" runat="server" Text="Item #:" EnableViewState="false"></asp:Localize>
</th>
<td>
<span itemprop="sku"><asp:Literal ID="Sku" runat="server"></asp:Literal></span>
</td>
</tr>
<tr id="trPartNumber" runat="server" enableviewstate="false">
<th class="rowHeader">
<asp:Localize ID="PartNumberLocalize" runat="server" Text="Part #:" EnableViewState="false"></asp:Localize>
</th>
<td>
<span itemprop="mpn"><asp:Literal ID="PartNumber" runat="server"></asp:Literal></span>
</td>
</tr>
<tr id="trRegPrice" runat="server" enableviewstate="false">
<th class="rowHeader">
<asp:Localize ID="RegPriceLocalize" runat="server" Text="Reg. Price:" EnableViewState="false"></asp:Localize>
</th>
<td>
<asp:Label ID="RegPrice" runat="server" SkinID="MSRP" EnableViewState="false"></asp:Label>
</td>
</tr>
<tr id="trOurPrice" runat="server" EnableViewState="false">
<th class="rowHeader">
<asp:Localize ID="OurPriceLocalize" runat="server" Text="Our Price:" EnableViewState="false"></asp:Localize>
</th>
<td>
<span itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<uc:ProductPrice ID="OurPrice" runat="server" EnableDefaultKitProducts="false" HideZeroPrice="false" IncludeRichSnippetsWraper="True" />
</span>
</td>
</tr>
<tr id="trVariablePrice" runat="server" enableviewstate="false">
<th class="rowHeader">
<asp:Localize ID="VariablePriceLabel" runat="server" Text="Enter Price:" EnableViewState="false"></asp:Localize>
</th>
<td>
<asp:TextBox ID="VariablePrice" runat="server" MaxLength="8" Width="60px" ValidationGroup="AddToBasket"></asp:TextBox>
<asp:PlaceHolder ID="phVariablePrice" runat="server"></asp:PlaceHolder>
</td>
</tr>
<tr id="rowSubscription" runat="server" enableviewstate="false" Visible="false">
<th class="rowHeader"> </th>
<td>
<asp:Literal ID="RecurringPaymentMessage" runat="server"></asp:Literal>
</td>
</tr>
<asp:Repeater ID="OptionsList" runat="server">
<ItemTemplate>
<tr>
<th class="rowHeader" >
<%#GetOptionName(Container.DataItem)%>
</th>
<td runat="server" Visible='<%#!((ProductOption)Container.DataItem).Option.ShowThumbnails%>'>
<asp:DropDownList ID="OptionChoices" runat="server" DataTextField="ChoiceName" DataValueField="ChoiceId" AutoPostBack="true" DataSource='<%#GetOptionChoices(Container.DataItem, Container.ItemIndex)%>' EnableViewState="true" OnDataBound="OptionChoices_DataBound" ></asp:DropDownList>
<asp:RequiredFieldValidator ID="OptionRequiredValidator" runat="server" ControlToValidate="OptionChoices" Text="*" ValidationGroup="AddToBasket" ErrorMessage='<%#string.Format("Please make your selection for {0}.", GetOptionName(Container.DataItem))%>' />
<asp:HiddenField ID="OptionID" runat="server" Value='<%#Eval("OptionId")%>' />
</td>
<td runat="server" Visible='<%#((ProductOption)Container.DataItem).Option.ShowThumbnails%>'>
<cb:OptionPicker ID="OptionPicker" runat="server" CssClass="optionPicker" AutoPostBack="true" OptionId='<%#Eval("OptionId")%>' ForceToLoadAllChoices='<%#ShowAllOptions%>' SelectedChoices='<%#_SelectedOptionChoices%>' OnLoad="OptionPicker_Load" RetainLargerImageAspectRatio="true" LargerImageMaxHeight="300" LargerImageMaxWidth="300" />
<cb:OptionPickerValidator ID="OptionPickerValidator" runat="server" ControlToValidate="OptionPicker" Text="*" ValidationGroup="AddToBasket" ErrorMessage='<%#string.Format("Please make your selection for {0}.", GetOptionName(Container.DataItem))%>' />
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
<asp:Repeater ID="KitsList" runat="server" OnItemDataBound="KitsList_ItemDataBound">
<ItemTemplate>
<tr id="Tr1" runat="server" class="custom" Visible='<%#((ProductKitComponent)Container.DataItem).KitComponent.InputType != KitInputType.IncludedHidden%>'>
<th class="custom">
<%#GetKitComponentName(Container.DataItem)%>
</th>
<td id="Td1" runat="server">
<asp:PlaceHolder runat="server" ID="phControl" />
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
<asp:Repeater ID="TemplatesList" runat="server" OnItemDataBound="TemplatesList_ItemDataBound">
<ItemTemplate>
<tr class="custom">
<th class="custom">
<%#GetUserPrompt(Container.DataItem)%>
</th>
<td runat="server">
<asp:PlaceHolder runat="server" ID="phControl" />
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
<asp:PlaceHolder ID="phAddToBasketWarningOpt" runat="server" EnableViewState="false" Visible="false">
<tr>
<td> </td>
<td colspan="8">
<asp:Label ID="AddToBasketWarningOpt" runat="server" EnableViewState="false" SkinID="ErrorCondition" Text="Please make your selections above."></asp:Label>
</td>
</tr>
</asp:PlaceHolder>
<asp:PlaceHolder runat="server" id="phKitOptions" EnableViewState="false"></asp:PlaceHolder>
<asp:PlaceHolder ID="phAddToBasketWarningKit" runat="server" EnableViewState="false" Visible="false">
<tr>
<td> </td>
<td colspan="8">
<asp:Label ID="AddToBasketWarningKit" runat="server" EnableViewState="false" SkinID="ErrorCondition" Text="Please make your selections above."></asp:Label>
</td>
</tr>
</asp:PlaceHolder>
<tr id="rowQuantity" runat="server" enableviewstate="false">
<th class="rowHeader">
<asp:Localize ID="QuantityLocalize" runat="server" Text="Quantity:"></asp:Localize>
</th>
<td nowrap="nowrap">
<cb:updowncontrol Width="30" ID="Quantity" runat="server" CssClass="quantityUpDown" onfocus="this.select()"></cb:updowncontrol><asp:CustomValidator ID="QuantityValidaor" runat="server" ValidationGroup="AddToBasket" ErrorMessage="Quantity can not exceed the available stock of {0}." ControlToValidate="Quantity">*</asp:CustomValidator>
<asp:PlaceHolder ID="QuantityLimitsPanel" runat="server" EnableViewState="false">
</asp:PlaceHolder>
</td>
</tr>
<tr>
<td></td>
<td>
<asp:PlaceHolder ID="InventoryDetailsPanel" runat="server" EnableViewState="false"></asp:PlaceHolder>
</td>
</tr>
</table>
<a class="technifit" onclick="window.open('http://shop.golfusa.com/techniFIT-FAQ.aspx','', 'width=1050, height=700, location=no, menubar=no, status=no,toolbar=no, scrollbars=yes, resizable=no'); return false" href="http://http://shop.golfusa.com/techniFIT-FAQ.aspx"><img src="/App_Themes/GolfUSA/images/technifit.jpg"></a>
<a href='javascript: toggle()'><p id="toggle_button" class="toggle" onclick="change_text()">Customize This Item</p></a>
<h4 class="custom">Custom Items are ordered direct from the Manufacturer. Items usually ship within 5-7 days.</h4>
<asp:Button ID="AddToBasketButton" runat="server" Visible="true" OnClick="AddToBasketButton_Click" Text="+ Add to Cart" EnableViewState="false" ValidationGroup="AddToBasket"></asp:Button>
<asp:Button ID="UpdateBasketButton" runat="server" Visible="false" OnClick="UpdateBasketButton_Click" Text="Update Cart" EnableViewState="false"></asp:Button>
<asp:Button ID="AddToWishlistButton" runat="server" Visible="true" OnClick="AddToWishlistButton_Click" Text="Add to Wishlist" EnableViewState="false" ValidationGroup="AddToBasket"></asp:Button>
</div>
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</div>PLEASE HELP!