drop down list manipulation [Archive]

View Full Version : drop down list manipulation

vestedinterest

02-Jun-2003, 02:31 PM

Hi All
I know I can link to a product from anywhere but is it possible to show a specific choice from an attribute of that product when the attribute is a dropdown list instead of the first choice? Additionally I would like to show a popup image when the user selects between different choices in this list. I can do this with javascript outwith actinic however I'm having problems getting it to work within.
Anyone Help.

cdicken

03-Jun-2003, 01:55 PM

There is one possible solution here (http://community.actinic.com/showthread.php?s=&threadid=780) which involves putting the code for images within the 'HTML for Name' field of a set of radio buttons.

The HTML for Name field can also be used to add values in the drop-down list. Whether or not Javascript could read these and act upon them is another matter.

vestedinterest

03-Jun-2003, 02:33 PM

Thanks for that, I did look at that post before however I have a list of over a hundred choices therefor the check box isn't an option.
Can I force actinic to use the choice name for the option value instead of the numbers it generates, if so I may be able to create a solution.

cdicken

04-Jun-2003, 01:15 PM

Unfortunately not. These choice values are all hard-wired into the online cart and checkout so it is not possible to get access to them.

NormanRouxel

04-Jun-2003, 02:42 PM

If you fancy doing this another way I've a set of extensions to Actinic that auto create an image map from the list of choices.

You include a single big image containing a matrix of thumbnails of your choices and the appropriate choice is selected when you click that particular bit of the image.

See http://www.drillpine.biz/aura/acatalog/Shirt_Sizes_Demo.html for a demo and http://www.rouxel.cwc.net/actinicstuff.html for details.

Norman

vestedinterest

05-Jun-2003, 08:53 AM

I did see this extension before however with the number of options I have it would look messy. I had hoped there would be other solutions. I will have to go and have a rethink. Thanks for the help.

NormanRouxel

05-Jun-2003, 10:33 AM

I managed to adapt an existing hack to do what you need. Try this:-

Displaying a pop up image (or other info) when a drop down choice is selected.
You put the additional information into the "HTML for Name" field of each choice
within round brackets ( ).

e.g. Left Handed (leftimage.jpg) Operation
Right Handed (rightimage.jpg) Operation

The information within the brackets will be hidden from display and stored in an array.
The stored item will be available in the JavaScript routine showimage whenever a choice is selected.
Note:- You should not use the single quote ' character in any of your choices "HTML for Name" fields.

Put the following code into Act_primary.html (just above the <BODY> tag).

<script language=JavaScript>
function setchoice(choicename){
var thisimage = '';
var result = choicename.match(/(.*)\((.*)\)(.*)/); // see if HTML for Name contains (.....)
if ( result != null )
{
document.write(result[1] + result[3]); // hide the embedded image
thisimage = result[2]; // the text within ( )
}
else
{
document.write(choicename); // the unaltered choice text
}

eval(current + '[' + base++ + '] = \'' + thisimage + '\''); // save the image name
}

function showimage(value){
if ( value != '' )
{
alert(value); // your own code here
}
}
</script>

You should change the code in showimage to do whatever you need.

Replace Act_VariantListHeader with the following code:-




<script language=JavaScript>
var imgNETQUOTEVAR:ATTRIBUTEREF = new Array();
var current = 'imgNETQUOTEVAR:ATTRIBUTEREF';
var base = 1;
</script>

<SELECT NAME="NETQUOTEVAR:ATTRIBUTEREF" onchange="showimage(imgNETQUOTEVAR:ATTRIBUTEREF[this.value])">




Replace Act_VariantListChoice.html with the following code:-




<OPTION VALUE=NETQUOTEVAR:CHOICESELVALUE NETQUOTEVAR:ITEMSELECTED>

<script language=JavaScript>
setchoice('NETQUOTEVAR:CHOICENAME');
</script>




Update and that's that.

The code above works on live sites. It may fail when previewing.

Norman

vestedinterest

12-Jun-2003, 08:33 AM

Hi
Thanks for the excellent response however I cannot get the code to work properly. If I put it into the pages as you describe the drop downs are blank but I have discovered if I comment out the eval line the dropdowns are populated! I'm no javascript guru so cant figure this out. Can you help me again or do you have a site where this code is used?

Thanks again

Andrew

NormanRouxel

12-Jun-2003, 10:00 AM

Do your image names have arithmetic characters in them e.g. "-"? If so try using just textual image names.

Norman

NormanRouxel

12-Jun-2003, 10:19 AM

Sorry about that. Your reply led me straight to it.

It's the darn forum munging the pasted in code (even within CODE tags).

It seems to be displaying backslash escaped characters instead of showing the backslash and then the following character as written. Not very useful on a technical forum.

I've attached the relevant file instead. I also added a tiny bit to make it fail-safe on non-JavaScript browsers.

If anyone else is reading the thread don't use the info posted a few entries above. Use this attached file instead.

Norman

vestedinterest

12-Jun-2003, 11:42 AM

BRILLIANT!
Thats fantastic. The noscript code displays the choice twice but I'll leave it out for now.
Thanks again
Andrew

NormanRouxel

12-Jun-2003, 01:17 PM

The noscript code displays the choice twice but I'll leave it out for now

Wierd! Try it with capitals.

Norman