Action for a FORM option

October 19, 2010 at 13:19:16
Specs: Windows XP
Hello, i need some help :)

Lets say i got a simple form with option like :

<select>
<option> 1 </option>
<option> 2 </option>
</select>

I would like to set an action when one of the options is clicked, like, if i click "1" it shows image nr.1 .. and if i click "2" it shows image nr.2

Note: I want i to be without pressing a submit button at form .. just if a option is clicked.


See More: Action for a FORM option

Report •

#1
October 20, 2010 at 22:55:39
You'd need client side scripting such as javascript, so whether or not it worked would depend on the user's client having scripting support enabled.

<select onchange="updateImg(this.options[this.selectedIndex].innerHTML);">
<option>1</option>
<option>2</option>
</select>


<script type="text/javascript"><!--

function updateImg(the_img) {

// need more info to assign the image
}
//--></script>

Perhaps something like that.

HTH

-------------------------------------------
I have no aspiration for preaching. ;-)


Report •

#2
October 21, 2010 at 05:25:34
Thank you, but could you show me please more of the JavaScript ?

<script type="text/javascript"><!--

function updateImg(the_img) {

// need more info to assign the image
}
//--></script>

I have no idea how to make JavaScript working, could you please show with sample image ?


Report •

#3
October 21, 2010 at 12:12:40
It's a bit difficult to give you a specific answer as I don't know what your doc has, but say you have the following

<html>
<head>
<script type="text/javascript"><!--

function updateImg(target) {

document.getElementsByTagName("img")[0].src =
(target == 0 ? 'original.gif' : 'image1.gif');

// target would be either 0 or 1
}

//--></script>

</head>
<body>

<select onchange="updateImg(this.selectedIndex);">
<option>1</option>
<option>2</option>
</select>

<img src="original.gif">

</body>
</html></pre>

The above would only be pratical with one image in the document; if you have many images, then by giving each a unique id or perhaps just the one you want to alter, you could set the image as you need to.

HTH

-------------------------------------------
I have no aspiration for preaching. ;-)


Report •

Related Solutions

#4
October 21, 2010 at 13:38:38
<script type="text/javascript">
function disp_value()
{
var w = document.vp_form_mount.mount_list.selectedIndex;
var selected_value = document.vp_form_mount.mount_list.options[w].value;

document.location="vp.php?value="+selected_value;
}
</script>

<FORM NAME="vp_form_mount" ACTION="" METHOD="POST">
<SELECT NAME="mount_list" onchange="disp_value();">
<OPTION VALUE="m0" > </OPTION>
<OPTION VALUE="m1">First Mount</OPTION>
<OPTION VALUE="m2">The Second Mount</OPTION>
</SELECT>
<input type="submit" onClick="return confirmSubmit()" name="submit" value="Buy it !">
</FORM>

if ($_GET[value] == m1)
{
echo " First Image ";
}

if ($_GET[value] == m2)
{
echo " Second Image ";
}

----------------------------------------------------------------
I got this working like this by saving current selection in link, how do you think, is this OK ?


Report •

Ask Question