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!