V6 - Making a drop down box select a pop-up product info page with Add to Cart button.

The following templates will allow a range of products to be hidden on the page 
and replaced by a single SELECT statement containing an option for each product.
Selecting a product will open a po-up window containing the product details and
an Add to Cart button.

Don't use on sections with "Quantity On product page"  as errors (invalid quantity, etc) 
are sent back to the calling page and in this case it would be the popup page that has
already closed it's window.


PATCHING INSTRUCTIONS

********** Edit Act_ProductBody.html (this is the only patch to an existing template)
********** and add the following just after the start:-


<script language="JavaScript">
<!--
// set the window name to unique value
Now = new Date();
var WindowName = "W" + Now.getTime();
window.name = WindowName;
//-->
</script>


********** Make a new product template SelectStartProductLine.html


<!-- SelectStartProductLine HTML begin -->
<!-- Insert HTML for the top of the individual product -->
NETQUOTEVAR:INCLUDE Act_ProductSeparator.html
NETQUOTEVAR:ENDSEPARATOR
<tr>
<td colspan=3>
NETQUOTEVAR:PRODUCTDESCRIPTION<br>
<select name=dropdown onchange="if (this.value){ ShowPopUp('info_' + this.value + '.html', 600, 500); this.selectedIndex = 0 }">
<option value="" selected>NETQUOTEVAR:PRODUCTNAME</option>
<!-- NETQUOTEVAR:PRODUCTFORMBEGIN 
NETQUOTEVAR:TEMPLATEBEGINXML 
NETQUOTEVAR:PRODUCTIMAGE
NETQUOTEVAR:PRODUCTANCHOR
NETQUOTEVAR:PRODUCTNAME
NETQUOTEVAR:PRODUCTREF
NETQUOTEVAR:PRODUCTDESCRIPTION
NETQUOTEVAR:EXTINFOLINK
NETQUOTEVAR:EXTINFOBUTTON
NETQUOTEVAR:PRODUCTBEGINLINK
NETQUOTEVAR:PRODUCTLINKTEXT
NETQUOTEVAR:PRODUCTENDLINK
NETQUOTEVAR:PRICEEXPLANATION
NETQUOTEVAR:PRODUCTPRICE
NETQUOTEVAR:OTHERINFOPROMPT
NETQUOTEVAR:DATEPROMPT
NETQUOTEVAR:CARTERRORXML
NETQUOTEVAR:PRODUCTQUANTITY
NETQUOTEVAR:ADDTOCARTBUTTON
NETQUOTEVAR:TEMPLATEENDXML
NETQUOTEVAR:PRODUCTFORMEND -->
NETQUOTEVAR:NEXT
<!-- Insert HTML for the bottom of the individual product -->
<!-- SelectStartProductLine HTML end -->


********** Make another new product template SelectOptionProductLine.html


<!-- SelectOptionProductLine HTML begin -->
<!-- Insert HTML for the top of the individual product -->
<!-- NETQUOTEVAR:INCLUDE Act_ProductSeparator.html -->
NETQUOTEVAR:ENDSEPARATOR
<option value="NETQUOTEVAR:PRODUCTREFERENCE">NETQUOTEVAR:PRODUCTNAME</option>
<!-- NETQUOTEVAR:PRODUCTFORMBEGIN 
NETQUOTEVAR:TEMPLATEBEGINXML 
NETQUOTEVAR:PRODUCTIMAGE
NETQUOTEVAR:PRODUCTANCHOR
NETQUOTEVAR:PRODUCTNAME
NETQUOTEVAR:PRODUCTREF
NETQUOTEVAR:PRODUCTDESCRIPTION
NETQUOTEVAR:EXTINFOLINK
NETQUOTEVAR:EXTINFOBUTTON
NETQUOTEVAR:PRODUCTBEGINLINK
NETQUOTEVAR:PRODUCTLINKTEXT
NETQUOTEVAR:PRODUCTENDLINK
NETQUOTEVAR:PRICEEXPLANATION
NETQUOTEVAR:PRODUCTPRICE
NETQUOTEVAR:OTHERINFOPROMPT
NETQUOTEVAR:DATEPROMPT
NETQUOTEVAR:CARTERRORXML
NETQUOTEVAR:PRODUCTQUANTITY
NETQUOTEVAR:ADDTOCARTBUTTON
NETQUOTEVAR:TEMPLATEENDXML
NETQUOTEVAR:PRODUCTFORMEND -->

NETQUOTEVAR:NEXT
<!-- Insert HTML for the bottom of the individual product -->
<!-- SelectOptionProductLine HTML end -->


********** Make another new product template SelectEndProductLine.html


<!-- SelectEndProductLine HTML begin -->
<!-- Insert HTML for the top of the individual product -->
<!-- NETQUOTEVAR:INCLUDE Act_ProductSeparator.html -->
NETQUOTEVAR:ENDSEPARATOR
<option value="NETQUOTEVAR:PRODUCTREFERENCE">NETQUOTEVAR:PRODUCTNAME</option>
</select>
<!-- NETQUOTEVAR:PRODUCTFORMBEGIN 
NETQUOTEVAR:TEMPLATEBEGINXML 
NETQUOTEVAR:PRODUCTIMAGE
NETQUOTEVAR:PRODUCTANCHOR
NETQUOTEVAR:PRODUCTNAME
NETQUOTEVAR:PRODUCTREF
NETQUOTEVAR:PRODUCTDESCRIPTION
NETQUOTEVAR:EXTINFOLINK
NETQUOTEVAR:EXTINFOBUTTON
NETQUOTEVAR:PRODUCTBEGINLINK
NETQUOTEVAR:PRODUCTLINKTEXT
NETQUOTEVAR:PRODUCTENDLINK
NETQUOTEVAR:PRICEEXPLANATION
NETQUOTEVAR:PRODUCTPRICE
NETQUOTEVAR:OTHERINFOPROMPT
NETQUOTEVAR:DATEPROMPT
NETQUOTEVAR:CARTERRORXML
NETQUOTEVAR:PRODUCTQUANTITY
NETQUOTEVAR:ADDTOCARTBUTTON
NETQUOTEVAR:TEMPLATEENDXML
NETQUOTEVAR:PRODUCTFORMEND -->
</td></tr>
NETQUOTEVAR:NEXT
<!-- Insert HTML for the bottom of the individual product -->
<!-- SelectEndProductLine HTML end -->


********** Make a new Extended Info template AddtoCart_ExtendedInfo.html


<!-- AddtoCart_ExtendedInfo.html -->
<HTML>
<HEAD>
<Actinic:WINDOW WIDTH="600" HEIGHT="350"/>
<TITLE>NETQUOTEVAR:PAGETITLE NETQUOTEVAR:PAGEHEADER</TITLE>
   <Actinic:BASEHREF VALUE="NETQUOTEVAR:BASEHREF"/>
   <META NAME="ACTINICTITLE" CONTENT="NETQUOTEVAR:PAGEHEADER">
   <META HTTP-EQUIV="Content-Type" content="text/html; charset=iso-8859-1">
   <LINK REL=STYLESHEET HREF="actinic.css">

<script language="JavaScript">
<!--
function doit() {
// use unique name from source window as target.
popform.target = opener.WindowName;
// look through all parent forms 'till one containing field SID
var of = opener.document.forms;
var i = of.length - 1;
for ( var j = 0; j <= i; j++){
  var k = of[j].length - 1; 
  for ( var l = 0; l <= k; l++) {
    if ( of[j].elements[l].name == 'SID' ) {
      // patch in values from calling page
      popform.SID.value = of[j].elements[l].value;
      popform.action = of[j].action;
      popform.ACTINIC_REFERRER.value = opener.location.href;
      window.close();
      return true;
      } 
    }
  }
// should never get here but...
alert('Cannot find product form');
window.close();
return false;
}
//-->
</script>

</HEAD>
<BODY NETQUOTEVAR:BGIMAGE NETQUOTEVAR:BGCOLOR text="NETQUOTEVAR:FGCOLOR" NETQUOTEVAR:LINKCOLOR NETQUOTEVAR:VLINKCOLOR NETQUOTEVAR:ALINKCOLOR>

<FORM name="popform"  onsubmit="return doit();" METHOD=POST TARGET="" ACTION="">
<INPUT TYPE=HIDDEN NAME="SID" VALUE="">
<INPUT TYPE=HIDDEN NAME="PAGE" VALUE="PRODUCT">
<INPUT TYPE=HIDDEN NAME="ACTINIC_REFERRER" VALUE="">

<TABLE BORDER=0 cellpadding="5" cellspacing="0">
  <TR> 
    <TD rowspan="3" align="center" valign="top">
      <IMG SRC="NETQUOTEVAR:IMAGEFILE"
	  ALT="NETQUOTEVAR:ALTERNATETEXT"
	  BORDER=0
	  NETQUOTEVAR:IMAGEHEIGHT
	  NETQUOTEVAR:IMAGEWIDTH
	  NETQUOTEVAR:OTHERIMAGEMARKUP>

	  <!-- <IMG SRC="NETQUOTEVAR:INFOIMAGE" WIDTH=NETQUOTEVAR:INFOIMAGEWIDTH HEIGHT=NETQUOTEVAR:INFOIMAGEHEIGHT> -->
    </TD>
    <TD valign="top"> <b><span class="actregular">NETQUOTEVAR:PRODUCTNAME</span></b>&nbsp;NETQUOTEVAR:PRODUCTREF</TD>
  </TR>
  <TR> 
    <TD valign="top"><!-- NETQUOTEVAR:INFOTEXT -->NETQUOTEVAR:PRODUCTDESCRIPTION
      <br>
      <span class="actxsmall">NETQUOTEVAR:PRODUCTBEGINLINKNETQUOTEVAR:PRODUCTLINKTEXTNETQUOTEVAR:PRODUCTENDLINK
      NETQUOTEVAR:PRICEEXPLANATION </span>
      <br>
      <b>NETQUOTEVAR:PRODUCTPRICE</b>
      NETQUOTEVAR:PRODUCTQUANTITY
     <Actinic:ACTIONS>NETQUOTEVAR:ADDTOCARTBUTTON</Actinic:ACTIONS> 
   </TD>
  </TR>
  <TR> 
    <TD valign="top"> 
      <script language="JavaScript">
<!--
if (window.name != "ActPopup")
	{
	document.write('NETQUOTEVAR:CLOSELINK');
	}
else
	{
	document.write('<A HREF="javascript:window.close();">NETQUOTEVAR:CLOSELABEL</A>');
	}
//-->
</script>
    </TD>
  </TR>
</TABLE>
</form>
</BODY>
</HTML>
<!-- End AddtoCart_ExtendedInfo.html -->


********** Now whenever you want to create a set of drop down product names do the following.

Make sure your section does not use Quantity on Product Page.

For the selection list create a dummy product using product template SelectStartProductLine.html
   The product description of this product will appear above the selection list.
   The Product name will appear as the default (inactive) entry in the list.

For the products in the list use product template SelectOptionProductLine.html

For the last product in the list use product template SelectEndProductLine.html

For each product in the list (not the dummy one):-

Enter your details as usual with the description and image in the usual place.

Open the Advanced / Extended Information and tick "Generate Popup Page" (leave "Display by" blank)
Leave "Text" empty. (We show the main products Full Description in the popup.)
Leave "Image" empty. (We show the main products Image in the popup.)
Under Popup Page / Layout select AddtoCart_ExtendedInfo.html
Make sure the Page Name is info_<product reference>.html where <product reference> is the main Reference
(this should be the default).