On change listbox

johnjohn · December 1st, 2004, 10:01 AM

I have a listbox with 5 choice, I would like that if the user choose 1 particular word, it automatically link to a new page but does'nt do anything special if he choose any of the 4 others one.

Is it possible.

Thank you

Johnjohn

madhukp · December 1st, 2004, 10:23 AM

You can do this with JavaScript.

Let the select box name be cboChoices and the form name be frmOptionSelector. The sample code for doing this is :

<script Language="JavaScript">
    function funcRedirect()
    {
        if(document.frmOptionSelector.cboChoices.options[document.frmOptionSelector.cboChoices.selectedInde x].text=="<the option text which redirects to a different page>")
        {
            window.location="<the page to which the visitor is to be redirected>";
        }
    }
</script>

Then call the function funcRedirect in the onChange event of cboChoices.

Hope that helps.

johnjohn · December 1st, 2004, 11:10 AM

Thank you but maybe I don't understand something because it don't work, see my code. Thank you very much again.

<HTML>
<BODY>

<FORM METHOD='GET' ACTION='Test1.asp' NAME='frmOptionSelector' >

<SELECT NAME = 'cboChoices' onchange = 'funcRedirect()' >
<OPTION> the one
<OPTION> dude
<OPTION> UPDATE
</SELECT>

</FORM>

<script Language="JavaScript">
function funcRedirect()
{
    if(document.frmOptionSelector.cboChoices.options[document.frmOptionSelector.cboChoices.selectedInde x].text=="<UPDATE>")
    {
        window.location="<test2.asp>";
    }
}
</script>

</BODY>
</HTML>

mat41 · December 1st, 2004, 06:22 PM

johnjohn

COMMENTS:
1..Functions must have trailing semi-colons:
funcRedirect() = wrong
funcRedirect(); = correct
2..There is a very big difference between:
<UPDATE> and UPDATE
3..Same as above for:
<test2.asp> and test2.asp

IMO:
1..<option> tags should have a closing </option> tag
2..Almost all JS functions code should be in the head of your document
3..This post is better suited in the JS forum

This will work for you:

-----------------------cut n paste---------------------
<HTML>
<head>
<title></title>
<script Language="JavaScript">
function funcRedirect()
{
    if(document.frmOptionSelector.cboChoices.options[document.frmOptionSelector.cboChoices.selectedInde x].text=="UPDATE")
    {
        window.location="test2.asp";
    }
}
</script>
</head>
<BODY>
<FORM METHOD="GET" ACTION="Test1.asp" NAME="frmOptionSelector">
<SELECT NAME="cboChoices" onchange="funcRedirect();">
<OPTION>the one</option>
<OPTION>dude</option>
<OPTION>UPDATE</option>
</SELECT>
</FORM>
</BODY>
</HTML>
--------------------finish cut n paste----------------------

Wind is your friend
Matt

madhukp · December 2nd, 2004, 12:51 AM

What Matthew gave will work correctly.

Please do not send personal mails about the issues that are being discussed here.

Hope you won't get offended.

Cheers

Madhu