[Date Prev][Date Next][Thread Prev][Thread Next][Interchange by date
][Interchange by thread
]
Re: [ic] <select></select> picture
At 02:39 PM 9/11/01 +0100, joachim.richter wrote:
>Hi everybody,
>
>actually somebody asked this before, but I just cannot find it in the list.
>
>We have an article which has lets say 25 different color schemes,
>
>what we would like to is,
>as soon as the customer selects a certain color in the <select> field
>the color (pic) should be shown next to it
>
>the guy who answered this last time has a shop with fishing supply,
You caught me. (Thanks a lot Birgitt) :-P
Near the top of my flypage:
<SCRIPT LANGUAGE="Javascript">
<!--
function rollcolor () {
document.pick.src = '/order/images/chart/' +
document.att.mv_order_color.options[document.att.mv_order_color.selectedInde
x].value + '.jpg';
}
// -->
</SCRIPT>
This Javascript function changes the image source of the <IMG> tag named
"pick" to the selection in the form "att" select region named "mv_order_color".
The named form:
<FORM ACTION="[process-target]" METHOD=POST NAME=att>
The select area:
<SELECT NAME="mv_order_color" onChange="rollcolor();"><small>
[loop arg=[item-field color]]
<OPTION VALUE="[loop-code]"[perl interpolate=1]if ('[scratch
lastcolor]' =~ '[loop-code]') {return " SELECTED";} return
'';[/perl]>[loop-code] - [loop-field description]
[/loop]</small>
</SELECT>
The perl in the option will select a particular color automatically if the
customer had already picked that color before. (I'll let you figure out
that one..) :-D Can't give away ALL my secrets. You can safely remove
that code. The other [loop-code] and [loop-field description] will
probably be different for you -- in my implementation the data in the color
field correspond to items in my products.asc. (Probably not pretty, but
it's how I make a cross-reference between colors and items)
The image that rotates:
<IMG SRC="/0.gif" NAME="pick" WIDTH=40 HEIGHT=46 BORDER=0 ALT="Your color
choice">
Finally, near the very bottom of the page:
<SCRIPT>
<!--
rollcolor();
//-->
</SCRIPT>
This will populate the image with the first or default ([scratch
lastcolor]) image. I suppose this COULD go into the <body> as a
OnLoad... I think I skipped this part because it wouldn't be easy because
of how I [include] my header.
Live examples:
(A product with color options)
http://yamamoto.baits.com/cgi-bin/order/9-10
(A color with product options -- clicking on one of the products from this
page will make that color appear as the default selection in the product
flypage)
http://yamamoto.baits.com/cgi-bin/order/294
Hope this helps,
-Ryan
...evacuated from his offices in Chicago.
_______________________________________________
interchange-users mailing list
interchange-users@interchange.redhat.com
http://interchange.redhat.com/mailman/listinfo/interchange-users