Swap Images and fill in form - no reload page. PLEASE?

[autocrat]

Firstly, Hi folks.... (1st posting here!)...

Now, the pleasentry is dealt with, on to the not so pleasent part....

I've been asked if it's [possible to make something online.... so that viewers can click on a variety of options, and what they choose is displayed on screen.... each set of options pertain to a different part of the overal item.

That part was easy.

Yet now I have to do it so that each option selected will display a side AND a front view, and hopefullu fill in relevant parts of a form!

Guess what.... I'm boned.

So, in short, please help!

To clarify........


--OPTIONS--------------------------------------------IMGAGES------
Option - A -
1, 2, 3, 4, 5....................................................
Option - B -....................................................IMG A1.........IMG A2
1, 2, 3, 4, 5....................................................IMG B1.........IMG B2
Option - C -....................................................IMG C1.........IMG C2
1, 2, 3, 4, 5....................................................IMG D1.........IMG D2
Option - D -....................................................IMG E1.........IMG E2
1, 2, 3, 4, 5....................................................
Option - E -
1, 2, 3, 4, 5


--FORM--------------------------------------------
A_1/2/3/4/5 = "?"
B_1/2/3/4/5 = "?"
C_1/2/3/4/5 = "?"
D_1/2/3/4/5 = "?"
E_1/2/3/4/5 = "?"

You click on an option, the relevant image loads in the dedicated section, and the form automatical fills itself in with the correct detail.
Repeat through all options until you have visually built what you want, and the form is all filled in.... proceed to order form and transfer form details with you.

SO, the images need to swap without re-loading the page, each option must be able to be repeatedly altered and only have the last selection show in both the IMG and the FORM....

So, does that make sense?

All I need is a sample bit of code on how to alter from Option A 1 and 2, and fill in the Form......
though please be aware and am stupid and slow on some occassions, so prepare for odd questions!

Heres hoping I get some help!

[Rasczak]

Hey, you described it quite richly, so I will try to simplify :-)
You need two selects, each one influencing one image area - right?
Then it's about "onchange" attrib in the SELECT tag, in which option would look like this:

<OPTION value="175">image 175</OPTION>

Then, you call a JS func() which reads the option's value and then get the target image element, then change the source according the value...

Example:

image_element.src="my_pictures/first/175.gif"

The second SELECT would call the same function with a parameter which would switch to the "/second/" directory, get the second image's element and set the source for it as well...

My english is not good enough to describe it better, sorry

Originally Posted by autocrat

Firstly, Hi folks.... (1st posting here!)...

Now, the pleasentry is dealt with, on to the not so pleasent part....

I've been asked if it's [possible to make something online.... so that viewers can click on a variety of options, and what they choose is displayed on screen.... each set of options pertain to a different part of the overal item.

That part was easy.

Yet now I have to do it so that each option selected will display a side AND a front view, and hopefullu fill in relevant parts of a form!

Guess what.... I'm boned.

So, in short, please help!

To clarify........


--OPTIONS--------------------------------------------IMGAGES------
Option - A -
1, 2, 3, 4, 5....................................................
Option - B -....................................................IMG A1.........IMG A2
1, 2, 3, 4, 5....................................................IMG B1.........IMG B2
Option - C -....................................................IMG C1.........IMG C2
1, 2, 3, 4, 5....................................................IMG D1.........IMG D2
Option - D -....................................................IMG E1.........IMG E2
1, 2, 3, 4, 5....................................................
Option - E -
1, 2, 3, 4, 5


--FORM--------------------------------------------
A_1/2/3/4/5 = "?"
B_1/2/3/4/5 = "?"
C_1/2/3/4/5 = "?"
D_1/2/3/4/5 = "?"
E_1/2/3/4/5 = "?"

You click on an option, the relevant image loads in the dedicated section, and the form automatical fills itself in with the correct detail.
Repeat through all options until you have visually built what you want, and the form is all filled in.... proceed to order form and transfer form details with you.

SO, the images need to swap without re-loading the page, each option must be able to be repeatedly altered and only have the last selection show in both the IMG and the FORM....

So, does that make sense?

All I need is a sample bit of code on how to alter from Option A 1 and 2, and fill in the Form......
though please be aware and am stupid and slow on some occassions, so prepare for odd questions!

Heres hoping I get some help!